﻿@using BonjourQuotation.UI.Models.PartialModel
@using MvcCheckBoxList
@model OperationHotelGridViewModel
@{
    Layout = null;
    @*@Scripts.Render("~/Scripts/UIScript/HotelTab.js")*@
}
<script type="text/javascript">
    var HotelModel;
    var SelectedGridData = [];
  
    LoadHotelGrid(false);
    function LoadHotelGrid(IsClientLoad) {
       
        if (!IsClientLoad)
            HotelModel = $(@Html.Raw(Json.Encode(Model))).JSModel();
        var columns = [];
        var colWidth = [];
        var colOrder = [];
        var columnHeaders = [];
        var GrStatusdrop = [];
        var VnStatusdrop = [];
        var ArrCitydrop = [];
        var Currencydrop = ["USD", "CAD"];
        var Techdrop = ["ST", "IN", "G", "B"];
        var PaymentMethoddrop = [];
        var ComStatusdrop = ["Pending", "Paid"];
        var DayOfArrdrop = [];
        var MonthOfArrdrop = [];
        var VendorNamedrop = [];
        var Empdrop = [];
        $(HotelModel[0].Employee).each(function (index, elem) {
            Empdrop.push(elem.Text);
        });
        $(HotelModel[0].HotelFilterDayofArrival).each(function (index, elem) {
            DayOfArrdrop.push(elem.Text);
        });
        $(HotelModel[0].HotelFilterMonthofArrival).each(function (index, elem) {
            MonthOfArrdrop.push(elem.Text);
        });
        $(HotelModel[0].PaymentMethod).each(function (index, elem) {
            PaymentMethoddrop.push(elem.Text);
        });
       
        $(HotelModel[0].VendorInfo).each(function (index, elem) {
            VendorNamedrop.push(elem.VendorName);
        });
        $(HotelModel[0].GroupStatus).each(function (index, elem) {
            GrStatusdrop.push(elem.Text);
        });
        $(HotelModel[0].VendorStatus).each(function (index, elem) {
            VnStatusdrop.push(elem.Text);
        });
        $(HotelModel[0].SearchArrivalCity).each(function (index, elem) {
            ArrCitydrop.push(elem.Text);
        });

        if (HotelModel[0].OperationHotelGroupCodeView)
        {
            if (HotelModel[0].ViewGroupCode == true)
            {
                columnHeaders.push($("#GroupCodeDiv").html());
                HotelModel[0].OperationHotelGroupCodeEdit ? columns.push({ data: "GroupCode", type: "text" }) : columns.push({ data: "GroupCode", type: "text", readOnly: true });
                colWidth.push(130);
                colOrder.push(HotelModel[0].OperationHotelGroupCodeLineNo);
                $("#HotelGridGroupCodeDiv").hide();
            }
            else
                $("#HotelGridGroupCodeDiv").show();
        }
        if (HotelModel[0].OperationHotelCustomerView)
        {
            if (HotelModel[0].ViewCustomerCode == true)
            {
                columnHeaders.push($("#CustomerCodeDiv").html());
                HotelModel[0].OperationHotelCustomerEdit ? columns.push({ data: "CustomerCode", type: "text" }) : columns.push({ data: "CustomerCode", type: "text", readOnly: true });
                colWidth.push(150);
                colOrder.push(HotelModel[0].OperationHotelCustomerLineNo);
                $("#HotelGridCustomerCodeDiv").hide();
            }
            else
                $("#HotelGridCustomerCodeDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelDetailsView)
        {
            if (HotelModel[0].ViewVConfHtml == true)
            {
                columnHeaders.push($("#VConfHtmlDiv").html());
                columns.push({ data: "VConfHtml", renderer: "html" });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelDetailsLineNo);
                $("#HotelGridVConfHtmlDiv").hide();
            }
            else
                $("#HotelGridVConfHtmlDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelGroupStatusView)
        {
            if (HotelModel[0].ViewGroupStatus == true)
            {
                columnHeaders.push($("#GroupStatusDiv").html());
                HotelModel[0].OperationHotelGroupStatusEdit ? columns.push({ data: "SelectedGroupStatus", type: "dropdown", source: GrStatusdrop }) : columns.push({ data: "SelectedGroupStatus", type: "dropdown", source: GrStatusdrop, readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelGroupStatusLineNo);
                $("#HotelGridGroupStatusDiv").hide();
            }
            else
                $("#HotelGridGroupStatusDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelGroupNameView)
        {
            if (HotelModel[0].ViewGroupName == true)
            {
                columnHeaders.push($("#GroupNameDiv").html());
                HotelModel[0].OperationHotelGroupNameEdit ? columns.push({ data: "GroupName", type: "text" }) : columns.push({ data: "GroupName", type: "text", readOnly: true });
                colWidth.push(250);
                colOrder.push(HotelModel[0].OperationHotelGroupNameLineNo);
                $("#HotelGridGroupNameDiv").hide();
            }
            else
                $("#HotelGridGroupNameDiv").show();

            if (HotelModel[0].ViewGroupName == true) {
                columnHeaders.push($("#GroupBookedUnderDiv").html());
                HotelModel[0].OperationHotelGroupNameEdit ? columns.push({ data: "GroupBookedUnder", type: "text" }) : columns.push({ data: "GroupBookedUnder", type: "text", readOnly: true });
                colWidth.push(200);
                colOrder.push(HotelModel[0].OperationHotelGroupNameLineNo);
                $("#HotelGridGroupBookedUnderDiv").hide();
            }
            else
                $("#HotelGridGroupBookedUnderDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelArrivalDateView)
        {
            if (HotelModel[0].ViewArrivalDate == true)
            {
                columnHeaders.push($("#ArrivalDateDiv").html());
                HotelModel[0].OperationHotelArrivalDateEdit ? columns.push({ data: "ArrivalDate", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "ArrivalDate", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelArrivalDateLineNo);
                $("#HotelGridArrivalDateDiv").hide();
            }
            else
                $("#HotelGridArrivalDateDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelDepartureDateView)
        {
            if (HotelModel[0].ViewDepartureDate == true)
            {
                columnHeaders.push($("#DepartureDateDiv").html());
                HotelModel[0].OperationHotelDepartureDateEdit ? columns.push({ data: "DepartureDate", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "DepartureDate", type: "text", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelDepartureDateLineNo);
                $("#HotelGridDepartureDateDiv").hide();
            }
            else
                $("#HotelGridDepartureDateDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelRoomCountView)
        {
            if (HotelModel[0].ViewRoomCount == true)
            {
                columnHeaders.push($("#RoomCountDiv").html());
                HotelModel[0].OperationHotelRoomCountEdit ? columns.push({ data: "RoomCount", type: "numeric" }) : columns.push({ data: "RoomCount", type: "numeric", readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelRoomCountLineNo);
                $("#HotelGridRoomCountDiv").hide();
            }
            else
                $("#HotelGridRoomCountDiv").show();
        }
        ////
        if (HotelModel[0].OperationHotelEmployeeView) {
            if (HotelModel[0].ViewEmployee == true) {
                columnHeaders.push($("#EmployeeDiv").html());
                HotelModel[0].OperationHotelEmployeeEdit ? columns.push({ data: "SelectedEmployee", type: "dropdown", source: Empdrop }) : columns.push({ data: "SelectedEmployee", type: "dropdown", source: Empdrop, readOnly: true });
                colWidth.push(200);
                colOrder.push(HotelModel[0].OperationHotelEmployeeLineNo);
                $("#HotelGridEmployeeDiv").hide();
            }
            else
                $("#HotelGridEmployeeDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelVendorStatusView)
        {
            if (HotelModel[0].ViewVendorStatus == true)
            {
                columnHeaders.push($("#VendorStatusDiv").html());
                HotelModel[0].OperationHotelVendorStatusEdit ? columns.push({ data: "SelectedVendorStatus", type: "dropdown", source: VnStatusdrop }) : columns.push({ data: "SelectedVendorStatus", type: "dropdown", source: VnStatusdrop, readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelVendorStatusLineNo);
                $("#HotelGridVendorStatusDiv").hide();
            }
            else
                $("#HotelGridVendorStatusDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelVendorNameView)
        {
            if (HotelModel[0].ViewVendorName == true)
            {
                columnHeaders.push($("#VendorNameDiv").html());
                HotelModel[0].OperationHotelVendorNameEdit ? columns.push({ data: "VendorName", type: "autocomplete", source: VendorNamedrop, strict: false }) : columns.push({ data: "VendorName", type: "autocomplete", source: VendorNamedrop, strict: false, readOnly: true });
                colWidth.push(450);
                colOrder.push(HotelModel[0].OperationHotelVendorNameLineNo);
                $("#HotelGridVendorNameDiv").hide();
            }
            else
                $("#HotelGridVendorNameDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelCityView)
        {
            if (HotelModel[0].ViewVendorCity == true)
            {
                columnHeaders.push($("#VendorCityDiv").html());
                HotelModel[0].OperationHotelCityEdit ? columns.push({ data: "VendorCity", type: "text" }) : columns.push({ data: "VendorCity", type: "text", readOnly: true });
                colWidth.push(180);
                colOrder.push(HotelModel[0].OperationHotelCityLineNo);
                $("#HotelGridVendorCityDiv").hide();
            }
            else
                $("#HotelGridVendorCityDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelAddressView)
        {
            if (HotelModel[0].ViewVendorAddress == true)
            {
                columnHeaders.push($("#VendorAddressDiv").html());
                HotelModel[0].OperationHotelAddressEdit ? columns.push({ data: "VendorAddress", type: "text" }) : columns.push({ data: "VendorAddress", type: "text", readOnly: true });
                colWidth.push(250);
                colOrder.push(HotelModel[0].OperationHotelAddressLineNo);
                $("#HotelGridVendorAddressDiv").hide();
            }
            else
                $("#HotelGridVendorAddressDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelPhoneView)
        {
            if (HotelModel[0].ViewVendorPhone == true)
            {
                columnHeaders.push($("#VendorPhoneDiv").html());
                HotelModel[0].OperationHotelPhoneEdit ? columns.push({ data: "VendorPhone", type: "text" }) : columns.push({ data: "VendorPhone", type: "text", readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelPhoneLineNo);
                $("#HotelGridVendorPhoneDiv").hide();
            }
            else
                $("#HotelGridVendorPhoneDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelNameOfContactPersonView)
        {
            if (HotelModel[0].ViewVendorContactName == true)
            {
                columnHeaders.push($("#VendorContactNameDiv").html());
                HotelModel[0].OperationHotelNameOfContactPersonEdit ? columns.push({ data: "VendorContactName", type: "text" }) : columns.push({ data: "VendorContactName", type: "text", readOnly: true });
                colWidth.push(200);
                colOrder.push(HotelModel[0].OperationHotelNameOfContactPersonLineNo);
                $("#HotelGridVendorContactNameDiv").hide();
            }
            else
                $("#HotelGridVendorContactNameDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelEmailView)
        {
            if (HotelModel[0].ViewVendorEmail == true)
            {
                columnHeaders.push($("#VendorEmailDiv").html());
                HotelModel[0].OperationHotelEmailEdit ? columns.push({ data: "VendorEmail", type: "text" }) : columns.push({ data: "VendorEmail", type: "text", readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelEmailLineNo);
                $("#HotelGridVendorEmailDiv").hide();
            }
            else
                $("#HotelGridVendorEmailDiv").show();
        }
        //
        //if (HotelModel[0].OperationHotelViewContractView)
        //{
        //    if (Info.PerColumnView == true) {
        //        columnHeaders.push($("#VendorContractHtmlDiv").html());
        //        columns.push({ data: "VendorContractHtml", renderer: "html" });
        //        colWidth.push(130);
        //        colOrder.push(HotelModel[0].OperationHotelViewContractLineNo);
        //    }
        //}
        //
        if (HotelModel[0].OperationHotelViewGroupContractView) {
            columnHeaders.push($("#VendorGroupContractHtmlDiv").html());
            columns.push({ data: "VendorGroupContractHtml", renderer: "html" });
            colWidth.push(150);
            colOrder.push(HotelModel[0].OperationHotelViewGroupContractLineNo);
        }
        //
        if (HotelModel[0].OperationHotelPaxView)
        {
            if (HotelModel[0].ViewPax == true)
            {
                columnHeaders.push($("#PaxDiv").html());
                HotelModel[0].OperationHotelPaxEdit ? columns.push({ data: "NoOfPerson", type: "numeric" }) : columns.push({ data: "NoOfPerson", type: "numeric" });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelPaxLineNo);
                $("#HotelGridPaxDiv").hide();
            }
            else
                $("#HotelGridPaxDiv").show();
        }
        //
        if (HotelModel[0].OperationHotelArrivalCityView)
        {
            if (HotelModel[0].ViewArrivalCity == true)
            {
                columnHeaders.push($("#ArrivalCityDiv").html());
                HotelModel[0].OperationHotelArrivalCityEdit ? columns.push({ data: "ArrivalCity", type: "dropdown", source: ArrCitydrop }) : columns.push({ data: "ArrivalCity", type: "dropdown", source: ArrCitydrop, readOnly: true });
                colWidth.push(180);
                colOrder.push(HotelModel[0].OperationHotelArrivalCityLineNo);
                $("#HotelGridArrivalCityDiv").hide();
            }
            else
                $("#HotelGridArrivalCityDiv").show();
        }
        //if (HotelModel[0].ViewDepartureCity == true) {
        //    columnHeaders.push($("#DepartureCityDiv").html());
        //    columns.push({ data: "DepartureCity", type: "dropdown", source: ArrCitydrop });
        //    colWidth.push(140);
        //    $("#HotelGridDepartureCityDiv").hide();
        //}
        //else
        //    $("#HotelGridDepartureCityDiv").show();
        if (HotelModel[0].OperationHotelFileCompletationDaysView)
        {
            if (HotelModel[0].ViewFileCompDays == true)
            {
                columnHeaders.push($("#FileCompDaysDiv").html());
                HotelModel[0].OperationHotelFileCompletationDaysEdit ? columns.push({ data: "FileCompDays", type: "numeric" }) : columns.push({ data: "FileCompDays", type: "numeric", readOnly: true });
                colWidth.push(180);
                colOrder.push(HotelModel[0].OperationHotelFileCompletationDaysLineNo);
                $("#HotelGridFileCompDaysDiv").hide();
            }
            else
                $("#HotelGridFileCompDaysDiv").show();
        }
        if (HotelModel[0].OperationHotelNightsView)
        {
            if (HotelModel[0].ViewNights == true)
            {
                columnHeaders.push($("#NightsDiv").html());
                HotelModel[0].OperationHotelNightsEdit ? columns.push({ data: "Nights", type: "numeric" }) : columns.push({ data: "Nights", type: "numeric", readOnly: true });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelNightsLineNo);
                $("#HotelGridNightsDiv").hide();
            }
            else
                $("#HotelGridNightsDiv").show();
        }
        if (HotelModel[0].OperationHotelTotalCostView)
        {
            if (HotelModel[0].ViewTotalCost == true)
            {
                columnHeaders.push($("#TotalCostDiv").html());
                HotelModel[0].OperationHotelTotalCostEdit ? columns.push({ data: "TotalCost", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "TotalCost", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(110);
                colOrder.push(HotelModel[0].OperationHotelTotalCostLineNo);
                $("#HotelGridTotalCostDiv").hide();
            }
            else
                $("#HotelGridTotalCostDiv").show();
        }
        if (HotelModel[0].OperationHotelBreakDownTotalView)
        {
            if (HotelModel[0].ViewBreakDownTotal == true)
            {
                columnHeaders.push($("#BreakDownTotalDiv").html());
                HotelModel[0].OperationHotelBreakDownTotalEdit ? columns.push({ data: "BreakDownTotal", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "BreakDownTotal", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(150);
                colOrder.push(HotelModel[0].OperationHotelBreakDownTotalLineNo);
                $("#HotelGridBreakDownTotalDiv").hide();
            }
            else
                $("#HotelGridBreakDownTotalDiv").show();
        }
        if (HotelModel[0].OperationHotelOutstandingBalanceView)
        {
            if (HotelModel[0].ViewOutstandingBalance == true)
            {
                columnHeaders.push($("#OutstandingBalanceDiv").html());
                HotelModel[0].OperationHotelOutstandingBalanceEdit ? columns.push({ data: "OutstandingBalance", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "OutstandingBalance", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(180);
                colOrder.push(HotelModel[0].OperationHotelOutstandingBalanceLineNo);
                $("#HotelGridOutstandingBalanceDiv").hide();
            }
            else
                $("#HotelGridOutstandingBalanceDiv").show();
        }
        if (HotelModel[0].OperationHotelComAmountView)
        {
            if (HotelModel[0].ViewComAmount == true)
            {
                columnHeaders.push($("#ComAmountDiv").html());
                HotelModel[0].OperationHotelComAmountEdit ? columns.push({ data: "ComAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "ComAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelComAmountLineNo);
                $("#HotelGridComAmountDiv").hide();
            }
            else
                $("#HotelGridComAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelComDifferenceView)
        {
            if (HotelModel[0].ViewComDifference == true)
            {
                columnHeaders.push($("#ComDifferenceDiv").html());
                HotelModel[0].OperationHotelComDifferenceEdit ? columns.push({ data: "ComDifference", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "ComDifference", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelComDifferenceLineNo);
                $("#HotelGridComDifferenceDiv").hide();
            }
            else
                $("#HotelGridComDifferenceDiv").show();
        }
        if (HotelModel[0].OperationHotelCurrencyView)
        {
            if (HotelModel[0].ViewCurrency == true)
            {
                columnHeaders.push($("#CurrencyDiv").html());
                HotelModel[0].OperationHotelCurrencyEdit ? columns.push({ data: "SelectedCurrency", type: "dropdown", source: Currencydrop }) : columns.push({ data: "SelectedCurrency", type: "dropdown", source: Currencydrop, readOnly: true });
                colWidth.push(100);
                colOrder.push(HotelModel[0].OperationHotelCurrencyLineNo);
                $("#HotelGridCurrencyDiv").hide();
            }
            else
                $("#HotelGridCurrencyDiv").show();
        }
        if (HotelModel[0].OperationHotelTotalInvoiceView)
        {
            if (HotelModel[0].ViewTotalInvoice == true)
            {
                columnHeaders.push($("#TotalInvoiceDiv").html());
                HotelModel[0].OperationHotelTotalInvoiceEdit ? columns.push({ data: "TotalInvoice", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "TotalInvoice", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelTotalInvoiceLineNo);
                $("#HotelGridTotalInvoiceDiv").hide();
            }
            else
                $("#HotelGridTotalInvoiceDiv").show();
        }
        if (HotelModel[0].OperationHotelTotalPaidView)
        {
            if (HotelModel[0].ViewTotalPaid == true)
            {
                columnHeaders.push($("#TotalPaidDiv").html());
                HotelModel[0].OperationHotelTotalPaidEdit ? columns.push({ data: "TotalPaid", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "TotalPaid", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelTotalPaidLineNo);
                $("#HotelGridTotalPaidDiv").hide();
            }
            else
                $("#HotelGridTotalPaidDiv").show();
        }
        if (HotelModel[0].OperationHotelFirstPaymentView)
        {
            if (HotelModel[0].ViewFirstPayment == true)
            {
                columnHeaders.push($("#FirstPaymentDiv").html());
                HotelModel[0].OperationHotelFirstPaymentEdit ? columns.push({ data: "FirstPayment", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "FirstPayment", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelFirstPaymentLineNo);
                $("#HotelGridFirstPaymentDiv").hide();
            }
            else
                $("#HotelGridFirstPaymentDiv").show();
        }
        if (HotelModel[0].OperationHotelFirstPaymentMethodView)
        {
            if (HotelModel[0].ViewFirstPaymentMethod == true)
            {
                columnHeaders.push($("#FirstPaymentMethodDiv").html());
                HotelModel[0].OperationHotelFirstPaymentMethodEdit ? columns.push({ data: "FirstPaymentMethod", type: "dropdown", source: PaymentMethoddrop }) : columns.push({ data: "FirstPaymentMethod", type: "dropdown", source: PaymentMethoddrop, readOnly: true });
                colWidth.push(170);
                colOrder.push(HotelModel[0].OperationHotelFirstPaymentMethodLineNo);
                $("#HotelGridFirstPaymentMethodDiv").hide();
            }
            else
                $("#HotelGridFirstPaymentMethodDiv").show();
        }
        if (HotelModel[0].OperationHotelPayFirstDetailsView)
        {
            columnHeaders.push($("#PayMeth1FormHtmlDiv").html());
            columns.push({ data: "PayMeth1FormHtml", renderer: "html" });
            colWidth.push(120);
            colOrder.push(HotelModel[0].OperationHotelPayFirstDetailsLineNo);
        }
        if (HotelModel[0].OperationHotelDateofFirstPaymentView)
        {
            if (HotelModel[0].ViewDateFirstPayment == true)
            {
                columnHeaders.push($("#DateFirstPaymentDiv").html());
                HotelModel[0].OperationHotelDateofFirstPaymentEdit ? columns.push({ data: "DateFirstPayment", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "DateFirstPayment", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(160);
                colOrder.push(HotelModel[0].OperationHotelDateofFirstPaymentLineNo);
                $("#HotelGridDateFirstPaymentDiv").hide();
            }
            else
                $("#HotelGridDateFirstPaymentDiv").show();
        }
        if (HotelModel[0].OperationHotelSecondPaymentView)
        {
            if (HotelModel[0].ViewSecondPayment == true)
            {
                columnHeaders.push($("#SecondPaymentDiv").html());
                HotelModel[0].OperationHotelSecondPaymentEdit ? columns.push({ data: "SecondPayment", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "SecondPayment", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelSecondPaymentLineNo);
                $("#HotelGridSecondPaymentDiv").hide();
            }
            else
                $("#HotelGridSecondPaymentDiv").show();
        }
        if (HotelModel[0].OperationHotelSecondPaymentMethodView)
        {
            if (HotelModel[0].ViewSecondPaymentMethod == true)
            {
                columnHeaders.push($("#SecondPaymentMethodDiv").html());
                HotelModel[0].OperationHotelSecondPaymentMethodEdit ? columns.push({ data: "SecondPaymentMethod", type: "dropdown", source: PaymentMethoddrop }) : columns.push({ data: "SecondPaymentMethod", type: "dropdown", source: PaymentMethoddrop, readOnly: true });
                colWidth.push(180);
                colOrder.push(HotelModel[0].OperationHotelSecondPaymentMethodLineNo);
                $("#HotelGridSecondPaymentMethodDiv").hide();
            }
            else
                $("#HotelGridSecondPaymentMethodDiv").show();
        }
        if (HotelModel[0].OperationHotelPaySecondDetailsView)
        {
            columnHeaders.push($("#PayMeth2FormHtmlDiv").html());
            columns.push({ data: "PayMeth2FormHtml", renderer: "html" });
            colWidth.push(120);
            colOrder.push(HotelModel[0].OperationHotelPaySecondDetailsLineNo);
        }
        if (HotelModel[0].OperationHotelDateofSecondPaymentView)
        {
            if (HotelModel[0].ViewDateSecondPayment == true)
            {
                columnHeaders.push($("#DateSecondPaymentDiv").html());
                HotelModel[0].OperationHotelDateofSecondPaymentEdit ? columns.push({ data: "DateSecondPayment", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "DateSecondPayment", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(170);
                colOrder.push(HotelModel[0].OperationHotelDateofSecondPaymentLineNo);
                $("#HotelGridDateSecondPaymentDiv").hide();
            }
            else
                $("#HotelGridDateSecondPaymentDiv").show();
        }
        if (HotelModel[0].OperationHotelThirdPaymentView)
        {
            if (HotelModel[0].ViewThirdPayment == true)
            {
                columnHeaders.push($("#ThirdPaymentDiv").html());
                HotelModel[0].OperationHotelThirdPaymentEdit ? columns.push({ data: "ThirdPayment", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "ThirdPayment", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelThirdPaymentLineNo);
                $("#HotelGridThirdPaymentDiv").hide();
            }
            else
                $("#HotelGridThirdPaymentDiv").show();
        }
        if (HotelModel[0].OperationHotelThirdPaymentMethodView)
        {
            if (HotelModel[0].ViewThirdPaymentMethod == true)
            {
                columnHeaders.push($("#ThirdPaymentMethodDiv").html());
                HotelModel[0].OperationHotelThirdPaymentMethodEdit ? columns.push({ data: "ThirdPaymentMethod", type: "dropdown", source: PaymentMethoddrop }) : columns.push({ data: "ThirdPaymentMethod", type: "dropdown", source: PaymentMethoddrop, readOnly: true });
                colWidth.push(160);
                colOrder.push(HotelModel[0].OperationHotelThirdPaymentMethodLineNo);
                $("#HotelGridThirdPaymentMethodDiv").hide();
            }
            else
                $("#HotelGridThirdPaymentMethodDiv").show();
        }
        if (HotelModel[0].OperationHotelPayThirdDetailsView)
        {
            columnHeaders.push($("#PayMeth3FormHtmlDiv").html());
            columns.push({ data: "PayMeth3FormHtml", renderer: "html" });
            colWidth.push(120);
            colOrder.push(HotelModel[0].OperationHotelPayThirdDetailsLineNo);
        }
        if (HotelModel[0].OperationHotelDateofThirdPaymentView)
        {
            if (HotelModel[0].ViewDateThirdPayment == true)
            {
                columnHeaders.push($("#DateThirdPaymentDiv").html());
                HotelModel[0].OperationHotelDateofThirdPaymentEdit ? columns.push({ data: "DateThirdPayment", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "DateThirdPayment", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(160);
                colOrder.push(HotelModel[0].OperationHotelDateofThirdPaymentLineNo);
                $("#HotelGridDateThirdPaymentDiv").hide();
            }
            else
                $("#HotelGridDateThirdPaymentDiv").show();
        }
        if (HotelModel[0].OperationHotelRefundReceivedfromHotelView)
        {
            if (HotelModel[0].ViewRefundReceivedHotel == true)
            {
                columnHeaders.push($("#RefundReceivedHotelDiv").html());
                HotelModel[0].OperationHotelRefundReceivedfromHotelEdit ? columns.push({ data: "RefundReceivedHotel", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "RefundReceivedHotel", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(220);
                colOrder.push(HotelModel[0].OperationHotelRefundReceivedfromHotelLineNo);
                $("#HotelGridRefundReceivedHotelDiv").hide();
            }
            else
                $("#HotelGridRefundReceivedHotelDiv").show();
        }
        if (HotelModel[0].OperationHotelTotalChargedView)
        {
            if (HotelModel[0].ViewTotalCharged == true)
            {
                columnHeaders.push($("#TotalChargedDiv").html());
                HotelModel[0].OperationHotelTotalChargedEdit ? columns.push({ data: "TotalCharged", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "TotalCharged", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelTotalChargedLineNo);
                $("#HotelGridTotalChargedDiv").hide();
            }
            else
                $("#HotelGridTotalChargedDiv").show();
        }
        if (HotelModel[0].OperationHotelAuthDiffView) {
            if (HotelModel[0].ViewAuthDiff == true) {
                columnHeaders.push($("#AuthDiffDiv").html());
                HotelModel[0].OperationHotelAuthDiffEdit ? columns.push({ data: "AuthDiff", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "AuthDiff", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelAuthDiffLineNo);
                $("#HotelGridAuthDiffDiv").hide();
            }
            else
                $("#HotelGridAuthDiffDiv").show();
        }
        if (HotelModel[0].OperationHotelAccountingMemoView)
        {
            if (HotelModel[0].ViewAccountingMemo == true)
            {
                columnHeaders.push($("#AccountingMemoDiv").html());
                HotelModel[0].OperationHotelAccountingMemoEdit ? columns.push({ data: "AccountingMemo", type: "text" }) : columns.push({ data: "AccountingMemo", type: "text", readOnly: true });
                colWidth.push(400);
                colOrder.push(HotelModel[0].OperationHotelAccountingMemoLineNo);
                $("#HotelGridAccountingMemoDiv").hide();
            }
            else
                $("#HotelGridAccountingMemoDiv").show();
        }
        if (HotelModel[0].OperationHotelCommissionStatusView)
        {
            if (HotelModel[0].ViewCommissionStatus == true)
            {
                columnHeaders.push($("#CommissionStatusDiv").html());
                HotelModel[0].OperationHotelCommissionStatusEdit ? columns.push({ data: "SelectedCommissionStatus", type: "dropdown", source: ComStatusdrop }) : columns.push({ data: "SelectedCommissionStatus", type: "dropdown", source: ComStatusdrop, readOnly: true });
                colWidth.push(160);
                colOrder.push(HotelModel[0].OperationHotelCommissionStatusLineNo);
                $("#HotelGridCommissionStatusDiv").hide();
            }
            else
                $("#HotelGridCommissionStatusDiv").show();
        }
        if (HotelModel[0].OperationHotelComPercentView)
        {
            if (HotelModel[0].ViewCommissionPrc == true)
            {
                columnHeaders.push($("#CommissionPrcDiv").html());
                HotelModel[0].OperationHotelComPercentEdit ? columns.push({ data: "CommissionPrc", type: "numeric" }) : columns.push({ data: "CommissionPrc", type: "numeric", readOnly: true });
                colWidth.push(90);
                colOrder.push(HotelModel[0].OperationHotelComPercentLineNo);
                $("#HotelGridCommissionPrcDiv").hide();
            }
            else
                $("#HotelGridCommissionPrcDiv").show();
        }
        if (HotelModel[0].OperationHotelComReceivedView)
        {
            if (HotelModel[0].ViewCommissionReceived == true)
            {
                columnHeaders.push($("#CommissionReceivedDiv").html());
                HotelModel[0].OperationHotelComReceivedEdit ? columns.push({ data: "CommissionReceived", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "CommissionReceived", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelComReceivedLineNo);
                $("#HotelGridCommissionReceivedDiv").hide();
            }
            else
                $("#HotelGridCommissionReceivedDiv").show();
        }
        if (HotelModel[0].OperationHotelComDateReceivedView)
        {
            if (HotelModel[0].ViewCommissionDateReceived == true)
            {
                columnHeaders.push($("#CommissionDateReceivedDiv").html());
                HotelModel[0].OperationHotelComDateReceivedEdit ? columns.push({ data: "CommissionDateReceived", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "CommissionDateReceived", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(170);
                colOrder.push(HotelModel[0].OperationHotelComDateReceivedLineNo);
                $("#HotelGridCommissionDateReceivedDiv").hide();
            }
            else
                $("#HotelGridCommissionDateReceivedDiv").show();
        }
        if (HotelModel[0].OperationHotelCheckNumberView)
        {
            if (HotelModel[0].ViewCheckNumber == true)
            {
                columnHeaders.push($("#CheckNumberDiv").html());
                HotelModel[0].OperationHotelCheckNumberEdit ? columns.push({ data: "CheckNumber", type: "text" }) : columns.push({ data: "CheckNumber", type: "text", readOnly: true });
                colWidth.push(130);
                colOrder.push(HotelModel[0].OperationHotelCheckNumberLineNo);
                $("#HotelGridCheckNumberDiv").hide();
            }
            else
                $("#HotelGridCheckNumberDiv").show();
        }
        if (HotelModel[0].OperationHotelCheckNumberAmountView)
        {
            if (HotelModel[0].ViewCheckAmount == true)
            {
                columnHeaders.push($("#CheckAmountDiv").html());
                HotelModel[0].OperationHotelCheckNumberAmountEdit ? columns.push({ data: "CheckAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "CheckAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(90);
                colOrder.push(HotelModel[0].OperationHotelCheckNumberAmountLineNo);
                $("#HotelGridCheckAmountDiv").hide();
            }
            else
                $("#HotelGridCheckAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelSGLView)
        {
            if (HotelModel[0].ViewSGLCount == true)
            {
                columnHeaders.push($("#SGLCountDiv").html());
                HotelModel[0].OperationHotelSGLEdit ? columns.push({ data: "SGLCount", type: "numeric" }) : columns.push({ data: "SGLCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelSGLLineNo);
                $("#HotelGridSGLCountDiv").hide();
            }
            else
                $("#HotelGridSGLCountDiv").show();
        }
        if (HotelModel[0].OperationHotelSGLAmountView)
        {
            if (HotelModel[0].ViewSGLAmount == true)
            {
                columnHeaders.push($("#SGLAmountDiv").html());
                HotelModel[0].OperationHotelSGLAmountEdit ? columns.push({ data: "SGLAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "SGLAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelSGLAmountLineNo);
                $("#HotelGridSGLAmountDiv").hide();
            }
            else
                $("#HotelGridSGLAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelDBLView)
        {
            if (HotelModel[0].ViewDBLCount == true)
            {
                columnHeaders.push($("#DBLCountDiv").html());
                HotelModel[0].OperationHotelDBLEdit ? columns.push({ data: "DBLCount", type: "numeric" }) : columns.push({ data: "DBLCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelDBLLineNo);
                $("#HotelGridDBLCountDiv").hide();
            }
            else
                $("#HotelGridDBLCountDiv").show();
        }
        if (HotelModel[0].OperationHotelDBLAmountView)
        {
            if (HotelModel[0].ViewDBLAmount == true)
            {
                columnHeaders.push($("#DBLAmountDiv").html());
                HotelModel[0].OperationHotelDBLAmountEdit ? columns.push({ data: "DBLAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "DBLAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelDBLAmountLineNo);
                $("#HotelGridDBLAmountDiv").hide();
            }
            else
                $("#HotelGridDBLAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelTWNView)
        {
            if (HotelModel[0].ViewTWNCount == true)
            {
                columnHeaders.push($("#TWNCountDiv").html());
                HotelModel[0].OperationHotelTWNEdit ? columns.push({ data: "TWNCount", type: "numeric" }) : columns.push({ data: "TWNCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelTWNLineNo);
                $("#HotelGridTWNCountDiv").hide();
            }
            else
                $("#HotelGridTWNCountDiv").show();
        }
        if (HotelModel[0].OperationHotelTWNAmountView)
        {
            if (HotelModel[0].ViewTWNAmount == true)
            {
                columnHeaders.push($("#TWNAmountDiv").html());
                HotelModel[0].OperationHotelTWNAmountEdit ? columns.push({ data: "TWNAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "TWNAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelTWNAmountLineNo);
                $("#HotelGridTWNAmountDiv").hide();
            }
            else
                $("#HotelGridTWNAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelTRPLView)
        {
            if (HotelModel[0].ViewTRPLCount == true)
            {
                columnHeaders.push($("#TRPLCountDiv").html());
                HotelModel[0].OperationHotelTRPLEdit ? columns.push({ data: "TRPLCount", type: "numeric" }) : columns.push({ data: "TRPLCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelTRPLLineNo);
                $("#HotelGridTRPLCountDiv").hide();
            }
            else
                $("#HotelGridTRPLCountDiv").show();
        }
        if (HotelModel[0].OperationHotelTRPLAmountView)
        {
            if (HotelModel[0].ViewTRPLAmount == true)
            {
                columnHeaders.push($("#TRPLAmountDiv").html());
                HotelModel[0].OperationHotelTRPLAmountEdit ? columns.push({ data: "TRPLAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "TRPLAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(75);
                colOrder.push(HotelModel[0].OperationHotelTRPLAmountLineNo);
                $("#HotelGridTRPLAmountDiv").hide();
            }
            else
                $("#HotelGridTRPLAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelQUDView)
        {
            if (HotelModel[0].ViewQUDCount == true)
            {
                columnHeaders.push($("#QUDCountDiv").html());
                HotelModel[0].OperationHotelQUDEdit ? columns.push({ data: "QUDCount", type: "numeric" }) : columns.push({ data: "QUDCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelQUDLineNo);
                $("#HotelGridQUDCountDiv").hide();
            }
            else
                $("#HotelGridQUDCountDiv").show();
        }
        if (HotelModel[0].OperationHotelQUDAmountView)
        {
            if (HotelModel[0].ViewQUDAmount == true)
            {
                columnHeaders.push($("#QUDAmountDiv").html());
                HotelModel[0].OperationHotelQUDAmountEdit ? columns.push({ data: "QUDAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "QUDAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelQUDAmountLineNo);
                $("#HotelGridQUDAmountDiv").hide();
            }
            else
                $("#HotelGridQUDAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelGuideView)
        {
            if (HotelModel[0].ViewGuideCount == true)
            {
                columnHeaders.push($("#GuideCountDiv").html());
                HotelModel[0].OperationHotelGuideEdit ? columns.push({ data: "GuideCount", type: "numeric" }) : columns.push({ data: "GuideCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelGuideLineNo);
                $("#HotelGridGuideCountDiv").hide();
            }
            else
                $("#HotelGridGuideCountDiv").show();
        }
        if (HotelModel[0].OperationHotelGuideAmountView)
        {
            if (HotelModel[0].ViewGuideAmount == true)
            {
                columnHeaders.push($("#GuideAmountDiv").html());
                HotelModel[0].OperationHotelGuideAmountEdit ? columns.push({ data: "GuideAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "GuideAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelGuideAmountLineNo);
                $("#HotelGridGuideAmountDiv").hide();
            }
            else
                $("#HotelGridGuideAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelDriverView)
        {
            if (HotelModel[0].ViewDriverCount == true)
            {
                columnHeaders.push($("#DriverCountDiv").html());
                HotelModel[0].OperationHotelDriverEdit ? columns.push({ data: "DriverCount", type: "numeric" }) : columns.push({ data: "DriverCount", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelDriverLineNo);
                $("#HotelGridDriverCountDiv").hide();
            }
            else
                $("#HotelGridDriverCountDiv").show();
        }
        if (HotelModel[0].OperationHotelDriverAmountView) {
            if (HotelModel[0].ViewDriverAmount == true) {
                columnHeaders.push($("#DriverAmountDiv").html());
                HotelModel[0].OperationHotelDriverAmountEdit ? columns.push({ data: "DriverAmount", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "DriverAmount", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelDriverAmountLineNo);
                $("#HotelGridDriverAmountDiv").hide();
            }
            else
                $("#HotelGridDriverAmountDiv").show();
        }
        if (HotelModel[0].OperationHotelTaxView)
        {
            if (HotelModel[0].ViewTaxPrc == true)
            {
                columnHeaders.push($("#TaxPrcDiv").html());
                HotelModel[0].OperationHotelTaxEdit ? columns.push({ data: "TaxPrc", type: "numeric" }) : columns.push({ data: "TaxPrc", type: "numeric", readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelTaxLineNo);
                $("#HotelGridTaxPrcDiv").hide();
            }
            else
                $("#HotelGridTaxPrcDiv").show();
        }
        if (HotelModel[0].OperationHotelOccTaxView)
        {
            if (HotelModel[0].ViewOccTax == true)
            {
                columnHeaders.push($("#OccTaxDiv").html());
                HotelModel[0].OperationHotelOccTaxEdit ? columns.push({ data: "OccTax", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "OccTax", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(90);
                colOrder.push(HotelModel[0].OperationHotelOccTaxLineNo);
                $("#HotelGridOccTaxDiv").hide();
            }
            else
                $("#HotelGridOccTaxDiv").show();
        }
        if (HotelModel[0].OperationHotelCBFView)
        {
            if (HotelModel[0].ViewCBF == true)
            {
                columnHeaders.push($("#CBFDiv").html());
                HotelModel[0].OperationHotelCBFEdit ? columns.push({ data: "CBF", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "CBF", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelCBFLineNo);
                columnHeaders.push($("#SelDiv").html());
                HotelModel[0].OperationHotelCBFEdit ? columns.push({ data: "CBFChecked", type: "checkbox" }) : columns.push({ data: "CBFChecked", type: "checkbox", readOnly: true });
                colWidth.push(40);
                colOrder.push(HotelModel[0].OperationHotelCBFLineNo);
                $("#HotelGridCBFDiv").hide();
            }
            else
                $("#HotelGridCBFDiv").show();
        }
        if (HotelModel[0].OperationHotelABFView)
        {
            if (HotelModel[0].ViewABF == true)
            {
                columnHeaders.push($("#ABFDiv").html());
                HotelModel[0].OperationHotelABFEdit ? columns.push({ data: "ABF", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "ABF", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelABFLineNo);
                columnHeaders.push($("#SelDiv").html());
                HotelModel[0].OperationHotelABFEdit ? columns.push({ data: "ABFChecked", type: "checkbox" }) : columns.push({ data: "ABFChecked", type: "checkbox", readOnly: true });
                colWidth.push(40);
                colOrder.push(HotelModel[0].OperationHotelABFLineNo);
                $("#HotelGridABFDiv").hide();
            }
            else
                $("#HotelGridABFDiv").show();
        }
        if (HotelModel[0].OperationHotelBagView)
        {
            if (HotelModel[0].ViewBag == true)
            {
                columnHeaders.push($("#BagDiv").html());
                HotelModel[0].OperationHotelBagEdit ? columns.push({ data: "Bag", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "Bag", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(70);
                colOrder.push(HotelModel[0].OperationHotelBagLineNo);
                columnHeaders.push($("#SelDiv").html());
                HotelModel[0].OperationHotelBagEdit ? columns.push({ data: "BagChecked", type: "checkbox" }) : columns.push({ data: "BagChecked", type: "checkbox", readOnly: true });
                colWidth.push(40);
                colOrder.push(HotelModel[0].OperationHotelBagLineNo);
                $("#HotelGridBagDiv").hide();
            }
            else
                $("#HotelGridBagDiv").show();
        }
        if (HotelModel[0].OperationHotelLunchView) {
            if (HotelModel[0].ViewLunch == true) {
                columnHeaders.push($("#LunchDiv").html());
                HotelModel[0].OperationHotelLunchEdit ? columns.push({ data: "Lunch", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "Lunch", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(90);
                colOrder.push(HotelModel[0].OperationHotelLunchLineNo);
                columnHeaders.push($("#SelDiv").html());
                HotelModel[0].OperationHotelLunchEdit ? columns.push({ data: "LunchChecked", type: "checkbox" }) : columns.push({ data: "LunchChecked", type: "checkbox", readOnly: true });
                colWidth.push(40);
                colOrder.push(HotelModel[0].OperationHotelLunchLineNo);
                $("#HotelGridLunchDiv").hide();
            }
            else
                $("#HotelGridLunchDiv").show();
        }
        if (HotelModel[0].OperationHotelDinnerView) {
            if (HotelModel[0].ViewDinner == true) {
                columnHeaders.push($("#DinnerDiv").html());
                HotelModel[0].OperationHotelDinnerEdit ? columns.push({ data: "Dinner", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "Dinner", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(90);
                colOrder.push(HotelModel[0].OperationHotelDinnerLineNo);
                columnHeaders.push($("#SelDiv").html());
                HotelModel[0].OperationHotelDinnerEdit ? columns.push({ data: "DinnerChecked", type: "checkbox" }) : columns.push({ data: "DinnerChecked", type: "checkbox", readOnly: true });
                colWidth.push(40);
                colOrder.push(HotelModel[0].OperationHotelDinnerLineNo);
                $("#HotelGridDinnerDiv").hide();
            }
            else
                $("#HotelGridDinnerDiv").show();
        }
        if (HotelModel[0].OperationHotelCompView)
        {
            if (HotelModel[0].ViewComp == true)
            {
                columnHeaders.push($("#CompDiv").html());
                HotelModel[0].OperationHotelCompEdit ? columns.push({ data: "Comp", type: "numeric" }) : columns.push({ data: "Comp", type: "numeric", readOnly: true });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelCompLineNo);
                $("#HotelGridCompDiv").hide();
            }
            else
                $("#HotelGridCompDiv").show();
        }
        if (HotelModel[0].OperationHotelExtraCostView) {
            if (HotelModel[0].ViewExtraCost == true) {
                columnHeaders.push($("#ExtraCostDiv").html());
                HotelModel[0].OperationHotelExtraCostEdit ? columns.push({ data: "ExtraCost", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "ExtraCost", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(120);
                colOrder.push(HotelModel[0].OperationHotelExtraCostLineNo);
                $("#HotelGridExtraCostDiv").hide();
            }
            else
                $("#HotelGridExtraCostDiv").show();
        }
        if (HotelModel[0].OperationHotelXLTDateView)
        {
            if (HotelModel[0].ViewXLTDate == true)
            {
                columnHeaders.push($("#XLTDateDiv").html());
                HotelModel[0].OperationHotelXLTDateEdit ? columns.push({ data: "XLTDate", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "XLTDate", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelXLTDateLineNo);
                $("#HotelGridXLTDateDiv").hide();
            }
            else
                $("#HotelGridXLTDateDiv").show();
        }
        if (HotelModel[0].OperationHotelDateFileReceivedView)
        {
            if (HotelModel[0].ViewDateFileReceived == true)
            {
                columnHeaders.push($("#DateFileReceivedDiv").html());
                HotelModel[0].OperationHotelDateFileReceivedEdit ? columns.push({ data: "DateFileReceived", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "DateFileReceived", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(160);
                colOrder.push(HotelModel[0].OperationHotelDateFileReceivedLineNo);
                $("#HotelGridDateFileReceivedDiv").hide();
            }
            else
                $("#HotelGridDateFileReceivedDiv").show();
        }
        if (HotelModel[0].OperationHotelDateFileCompletedView)
        {
            if (HotelModel[0].ViewDateFileCompleted == true)
            {
                columnHeaders.push($("#DateFileCompletedDiv").html());
                HotelModel[0].OperationHotelDateFileCompletedEdit ? columns.push({ data: "DateFileCompleted", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "DateFileCompleted", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                colWidth.push(170);
                colOrder.push(HotelModel[0].OperationHotelDateFileCompletedLineNo);
                $("#HotelGridDateFileCompletedDiv").hide();
            }
            else
                $("#HotelGridDateFileCompletedDiv").show();
        }
        if (HotelModel[0].OperationHotelDayofArrivalView)
        {
            if (HotelModel[0].ViewDayOfArrival == true)
            {
                columnHeaders.push($("#DayOfArrivalDiv").html());
                HotelModel[0].OperationHotelDayofArrivalEdit ? columns.push({ data: "DayOfArrival", type: "autocomplete", source: DayOfArrdrop, strict: false }) : columns.push({ data: "DayOfArrival", type: "autocomplete", source: DayOfArrdrop, strict: false, readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelDayofArrivalLineNo);
                $("#HotelGridDayOfArrivalDiv").hide();
            }
            else
                $("#HotelGridDayOfArrivalDiv").show();
        }
        if (HotelModel[0].OperationHotelMonthofArrivalView) {
            if (HotelModel[0].ViewMonthOfArrival == true) {
                columnHeaders.push($("#MonthOfArrivalDiv").html());
                HotelModel[0].OperationHotelMonthofArrivalEdit ? columns.push({ data: "MonthOfArrival", type: "autocomplete", source: MonthOfArrdrop, strict: false }) : columns.push({ data: "MonthOfArrival", type: "autocomplete", source: MonthOfArrdrop, strict: false, readOnly: true });
                colWidth.push(180);
                colOrder.push(HotelModel[0].OperationHotelMonthofArrivalLineNo);
                $("#HotelGridMonthOfArrivalDiv").hide();
            }
            else
                $("#HotelGridMonthOfArrivalDiv").show();
        }
        if (HotelModel[0].OperationHotelClientBookingCodeView)
        {
            if (HotelModel[0].ViewClientBookingCode == true)
            {
                columnHeaders.push($("#ClientBookingCodeDiv").html());
                HotelModel[0].OperationHotelClientBookingCodeEdit ? columns.push({ data: "ClientBookingCode", type: "text" }) : columns.push({ data: "ClientBookingCode", type: "text", readOnly: true });
                colWidth.push(170);
                colOrder.push(HotelModel[0].OperationHotelClientBookingCodeLineNo);
                $("#HotelGridClientBookingCode").hide();
            }
            else
                $("#HotelGridClientBookingCode").show();
        }
        //if (HotelModel[0].OperationHotelCheckInView)
        //{
        //    if (HotelModel[0].ViewCheckInDate == true)
        //    {
        //        columnHeaders.push($("#CheckInDateDiv").html());
        //        HotelModel[0].OperationHotelCheckInEdit ? columns.push({ data: "CheckInDate", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "CheckInDate", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
        //        colWidth.push(140);
        //        colOrder.push(HotelModel[0].OperationHotelCheckInLineNo);
        //        $("#HotelGridCheckInDateDiv").hide();
        //    }
        //    else
        //        $("#HotelGridCheckInDateDiv").show();
        //}
        //if (HotelModel[0].OperationHotelCheckOutView)
        //{
        //    if (HotelModel[0].ViewCheckOutDate == true)
        //    {
        //        columnHeaders.push($("#CheckOutDateDiv").html());
        //        HotelModel[0].OperationHotelCheckOutEdit ? columns.push({ data: "CheckOutDate", type: "date", dateFormat: 'D, dd/M/yy' }) : columns.push({ data: "CheckOutDate", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
        //        colWidth.push(140);
        //        colOrder.push(HotelModel[0].OperationHotelCheckOutLineNo);
        //        $("#HotelGridCheckOutDateDiv").hide();
        //    }
        //    else
        //        $("#HotelGridCheckOutDateDiv").show();
        //}
        if (HotelModel[0].OperationHotelEstimatedNumberofPaxView)
        {
            if (HotelModel[0].ViewEstimatedNumberPax == true)
            {
                columnHeaders.push($("#EstimatedNumberPaxDiv").html());
                HotelModel[0].OperationHotelEstimatedNumberofPaxEdit ? columns.push({ data: "EstNoOfPerson", type: "numeric" }) : columns.push({ data: "EstNoOfPerson", type: "numeric", readOnly: true });
                colWidth.push(100);
                colOrder.push(HotelModel[0].OperationHotelEstimatedNumberofPaxLineNo);
                $("#HotelGridEstimatedNumberPaxDiv").hide();
            }
            else
                $("#HotelGridEstimatedNumberPaxDiv").show();
        }
        if (HotelModel[0].OperationHotelEstimatedNumberofRoomsView) {
            if (HotelModel[0].ViewEstimatedNumberRooms == true) {
                columnHeaders.push($("#EstimatedNumberRoomsDiv").html());
                HotelModel[0].OperationHotelEstimatedNumberofRoomsEdit ? columns.push({ data: "EstimatedNumberRooms", type: "numeric" }) : columns.push({ data: "EstimatedNumberRooms", type: "numeric", readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelEstimatedNumberofRoomsLineNo);
                $("#HotelGridEstimatedNumberRoomsDiv").hide();
            }
            else
                $("#HotelGridEstimatedNumberRoomsDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedRoomView) {
            if (HotelModel[0].ViewQuotaRoomDiff == true) {
                columnHeaders.push($("#QuotaRoomDiffDiv").html());
                HotelModel[0].OperationHotelQuotedRoomEdit ? columns.push({ data: "QuotaRoomDiff", type: "numeric", format: '0,0.00' }) : columns.push({ data: "QuotaRoomDiff", type: "numeric", readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedRoomLineNo);
                $("#HotelGridQuotaRoomDiffDiv").hide();
            }
            else
                $("#HotelGridQuotaRoomDiffDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedRoomView)
        {
            if (HotelModel[0].ViewQuotaRoom == true)
            {
                columnHeaders.push($("#QuotaRoomDiv").html());
                HotelModel[0].OperationHotelQuotedRoomEdit ? columns.push({ data: "QuotaRoom", type: "numeric", format: '0,0.00' }) : columns.push({ data: "QuotaRoom", type: "numeric", readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedRoomLineNo);
                $("#HotelGridQuotaRoomDiv").hide();
            }
            else
                $("#HotelGridQuotaRoomDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedTaxView)
        {
            if (HotelModel[0].ViewQuotaTax == true)
            {
                columnHeaders.push($("#QuotaTaxDiv").html());
                HotelModel[0].OperationHotelQuotedTaxEdit ? columns.push({ data: "QuotaTax", type: "numeric", format: '0,0.00' }) : columns.push({ data: "QuotaTax", type: "numeric", readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedTaxLineNo);
                $("#HotelGridQuotaTaxDiv").hide();
            }
            else
                $("#HotelGridQuotaTaxDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedOccTaxView)
        {
            if (HotelModel[0].ViewQuotaOccTax == true)
            {
                columnHeaders.push($("#QuotaOccTaxDiv").html());
                HotelModel[0].OperationHotelQuotedOccTaxEdit ? columns.push({ data: "QuotaOccTax", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "QuotaOccTax", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedOccTaxLineNo);
                $("#HotelGridQuotaOccTaxDiv").hide();
            }
            else
                $("#HotelGridQuotaOccTaxDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedBrkView)
        {
            if (HotelModel[0].ViewQuotaBrk == true)
            {
                columnHeaders.push($("#QuotaBrkDiv").html());
                HotelModel[0].OperationHotelQuotedBrkEdit ? columns.push({ data: "QuotaBrk", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "QuotaBrk", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedBrkLineNo);
                $("#HotelGridQuotaBrkDiv").hide();
            }
            else
                $("#HotelGridQuotaBrkDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedLgView)
        {
            if (HotelModel[0].ViewQuotaLg == true)
            {
                columnHeaders.push($("#QuotaLgDiv").html());
                HotelModel[0].OperationHotelQuotedLgEdit ? columns.push({ data: "QuotaLg", type: "numeric", format: '$0,0.00' }) : columns.push({ data: "QuotaLg", type: "numeric", format: '$0,0.00', readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedLgLineNo);
                $("#HotelGridQuotaLgDiv").hide();
            }
            else
                $("#HotelGridQuotaLgDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedNightView)
        {
            if (HotelModel[0].ViewQuotaNight == true)
            {
                columnHeaders.push($("#QuotaNightDiv").html());
                HotelModel[0].OperationHotelQuotedNightEdit ? columns.push({ data: "QuotaNight", type: "numeric" }) : columns.push({ data: "QuotaNight", type: "numeric", readOnly: true });
                colWidth.push(140);
                colOrder.push(HotelModel[0].OperationHotelQuotedNightLineNo);
                $("#HotelGridQuotaNightDiv").hide();
            }
            else
                $("#HotelGridQuotaNightDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedNoteView)
        {
            if (HotelModel[0].ViewQuotaNote == true)
            {
                columnHeaders.push($("#QuotaNoteDiv").html());
                HotelModel[0].OperationHotelQuotedNoteEdit ? columns.push({ data: "QuotaNote", type: "text" }) : columns.push({ data: "QuotaNote", type: "text", readOnly: true });
                colWidth.push(500);
                colOrder.push(HotelModel[0].OperationHotelQuotedNoteLineNo);
                $("#HotelGridQuotaNoteDiv").hide();
            }
            else
                $("#HotelGridQuotaNoteDiv").show();
        }
        if (HotelModel[0].OperationHotelConfView)
        {
            if (HotelModel[0].ViewConfirmed == true)
            {
                columnHeaders.push($("#ConfirmedDiv").html());
                HotelModel[0].OperationHotelConfEdit ? columns.push({ data: "Confirmed", type: "text" }) : columns.push({ data: "Confirmed", type: "text", readOnly: true });
                colWidth.push(200);
                colOrder.push(HotelModel[0].OperationHotelConfLineNo);
                $("#HotelGridConfirmedDiv").hide();
            }
            else
                $("#HotelGridConfirmedDiv").show();
        }
        if (HotelModel[0].OperationHotelQuotedVendorNameView)
        {
            if (HotelModel[0].ViewQuotaVendorName == true)
            {
                columnHeaders.push($("#QuotaVendorNameDiv").html());
                HotelModel[0].OperationHotelQuotedVendorNameEdit ? columns.push({ data: "QuotaVendorName", type: "text" }) : columns.push({ data: "QuotaVendorName", type: "text", readOnly: true });
                colWidth.push(250);
                colOrder.push(HotelModel[0].OperationHotelQuotedVendorNameLineNo);
                $("#HotelGridQuotaVendorNameDiv").hide();
            }
            else
                $("#HotelGridQuotaVendorNameDiv").show();
        }
        if (HotelModel[0].OperationHotelTechView)
        {
            if (HotelModel[0].ViewVendorTech == true)
            {
                columnHeaders.push($("#VendorTechDiv").html());
                HotelModel[0].OperationHotelTechEdit ? columns.push({ data: "VendorTech", type: "dropdown", source: Techdrop }) : columns.push({ data: "VendorTech", type: "dropdown", source: Techdrop, readOnly: true });
                colWidth.push(80);
                colOrder.push(HotelModel[0].OperationHotelTechLineNo);
                $("#HotelGridVendorTechDiv").hide();
            }
            else
                $("#HotelGridVendorTechDiv").show();
        }
        if (HotelModel[0].OperationHotelNotesView)
        {
            if (HotelModel[0].ViewVendorNote == true)
            {
                columnHeaders.push($("#VendorNoteDiv").html());
                HotelModel[0].OperationHotelNotesEdit ? columns.push({ data: "VendorNote", type: "text" }) : columns.push({ data: "VendorNote", type: "text", readOnly: true });
                colWidth.push(450);
                colOrder.push(HotelModel[0].OperationHotelNotesLineNo);
                $("#HotelGridVendorNoteDiv").hide();
            }
            else
                $("#HotelGridVendorNoteDiv").show();
        }

        for (var ind1 = 0; ind1 < colOrder.length; ind1++)
            for (var ind2 = ind1 + 1; ind2 < colOrder.length; ind2++)
            {
                if(colOrder[ind2] < colOrder[ind1])
                {
                    var ord = colOrder[ind2];
                    colOrder[ind2] = colOrder[ind1];
                    colOrder[ind1] = ord;
                    var Header = columnHeaders[ind2];
                    columnHeaders[ind2] = columnHeaders[ind1];
                    columnHeaders[ind1] = Header;
                    var Width = colWidth[ind2];
                    colWidth[ind2] = colWidth[ind1];
                    colWidth[ind1] = Width;
                    var Col = columns[ind2];
                    columns[ind2] = columns[ind1];
                    columns[ind1] = Col;
                }
            }
        RedColorRendererForNegative = function (instance, td, row, col, prop, value, cellProperties) {
            Handsontable.renderers.NumericRenderer.apply(this, arguments);
            td.style.color = 'red';
        };

        RedColorRenderer = function (instance, td, row, col, prop, value, cellProperties) {
            Handsontable.renderers.AutocompleteRenderer.apply(this, arguments);
            td.style.color = 'red';
        };
        BlackColorRenderer = function (instance, td, row, col, prop, value, cellProperties) {
            Handsontable.renderers.AutocompleteRenderer.apply(this, arguments);
            td.style.color = 'black';
        };

        var data = HotelModel[0].Rows;
        var CopyRowStart = null;
        $('#OperHotelGrid').handsontable({
            data: data,
            minSpareRows: 1,
            colHeaders: columnHeaders,
            colWidths: colWidth,
            customBorders: true,
            contextMenu: false,
            manualColumnResize: true,
            manualColumnMove: true,
            manualRowResize: true,
            wordWrap: false,
            fixedColumnsLeft: HotelModel[0].OperationHotelFixedColumnCount,
            columns: columns,
            afterSelectionEnd: function (row1, column1, row2, column2) {
                SelectedGridData.length = 0;
                SelectedGridData.push(row1);
                SelectedGridData.push(row2);
                SelectedGridData.push(column1);
                SelectedGridData.push(column2);
                $("#GetSelected").removeAttr('disabled');
            },
            afterSelectionByProp: function (row1, prop1, row2, prop2) {
                if (prop1 == prop2 && prop1 == "VendorName" && this.getData()[row1].VendorID != null)
                    CopyRowStart = row1;
            },
            afterChange: function (data, source) {
                if (data != null)
                {
                    CheckOperHotelDataChanges();
                    debugger;
                    var instance = this;
                    if (data[0][1] == "VendorName" && instance.getData()[data[0][0]].SelectedVendorStatus == "Made") {
                        jAlert("Vendor name with Made status can not be changed.", "Warning!");
                        instance.getData()[data[0][0]].VendorName = data[0][2];
                        instance.render();
                    }
                    if (data[0][1] == "ABFChecked")
                    {
                        if(data[0][3] == true && instance.getData()[data[0][0]].CBFChecked == true)
                        {
                            jAlert("Can't be 2 types of Breakfast.", "Warning!");
                            instance.getData()[data[0][0]].ABFChecked = false;
                            instance.render();
                        }
                    }
                    if (data[0][1] == "CBFChecked") {
                        if (data[0][3] == true && instance.getData()[data[0][0]].ABFChecked == true) {
                            jAlert("Can't be 2 types of Breakfast.", "Warning!");
                            instance.getData()[data[0][0]].CBFChecked = false;
                            instance.render();
                        }
                    }
                    if (data[0][1] == "ArrivalDate") {
                        if (isFriSat(data[0][3])) {
                            instance.renderer = RedColorRenderer;
                        }
                        else {
                            instance.renderer = BlackColorRenderer;
                        }
                    }
                    $(data).each(function (index, elem) {
                        if (elem[1] == "VendorName")
                        {
                            var row = elem[0];
                            var VndElem = GetVendorElemByVendorName(elem[3]);
                            AutoCopyCols(instance, row, VndElem, CopyRowStart);
                            CopyRowStart++;
                        }
                        if (elem[1] == "SelectedVendorStatus") {
                            var VndElem = GetVendorElemByVendorID(instance.getData()[elem[0]].VendorID);
                            if (VndElem.VendorIsFind && elem[3] != elem[2]) {
                                jAlert("Vendor status can't be changed", "Warning!");
                                instance.getData()[elem[0]].SelectedVendorStatus = elem[2];
                            }
                        }
                    });
                    instance.render();
                }
            },
            cells: function (row, col, prop) {
               
                var Cellinstance = this;
                if (Cellinstance.renderer == Handsontable.renderers.NumericRenderer && Cellinstance.instance.getDataAtCell(row, col) < 0) {
                    Cellinstance.renderer = RedColorRendererForNegative;
                }
                if (prop == "ArrivalDate") {
                    var dataDate = Cellinstance.instance.getData()[row].ArrivalDate;
                    if (isFriSat(dataDate)) {
                        Cellinstance.renderer = RedColorRenderer;
                    }
                    else {
                        Cellinstance.renderer = BlackColorRenderer;
                    }
                }
            }
        });
        if($("#IsRemoveFilterDivShow").val() == "True")
        {
            $("#RemoveFiltersDiv").show();
        }
    }
    function isFriSat(date) {
        if (date != null && date.length > 10) {
            if (Date.parse(date)) {
                var DateNotFormated = Date.parse(date);
                var NewDate = new Date(DateNotFormated);
                var WeekDay = NewDate.getDay();
                return (WeekDay == 5 || WeekDay == 6); // 5 for friday, 6 for saturday
            }
            else
                return false;
        }
        else
            return false;
    }
    function GetSelectedClick() {
        if ($("#ForEmail").length > 0)
        {
            $("#ForEmail").remove();
        }
        //get the instance using jQuery wrapper
        var SelectedGridDataHeaders = [];
        var SelectedElementValues = [];
        if (SelectedGridData[2] > SelectedGridData[3])
        {
            var a = SelectedGridData[3];
            SelectedGridData[3] = SelectedGridData[2];
            SelectedGridData[2] = a;
           
        }
        if (SelectedGridData[0] > SelectedGridData[1])
        {
            var a = SelectedGridData[0];
            SelectedGridData[0] = SelectedGridData[1];
            SelectedGridData[1] = a;
           
        }
        for (var ind = SelectedGridData[2]; ind <= SelectedGridData[3]; ++ind)
        {
            SelectedGridDataHeaders.push(($('#OperHotelGrid').handsontable('getColHeader',ind)));
        }
        var hadstontabledata = $('#OperHotelGrid').handsontable('getData', SelectedGridData[0], SelectedGridData[2], SelectedGridData[1], SelectedGridData[3]);
        $("#OperHotelGridForm").append("<div id='ForEmail' style='Display:None'></div>");

        var table = $('<table></table>');

        var Headercolumn = $("<tr style='border: 1px solid black;border-collapse: collapse'></tr>");
        for (i = 0; i < SelectedGridDataHeaders.length; i++) {
            var Headerrow = $("<td style='border: 1px solid black;border-collapse: collapse;background-color:red;color:white'></td>").html(SelectedGridDataHeaders[i]);
            Headercolumn.append(Headerrow);
            table.append(Headercolumn);
        }
        $(table).find('.HotelGridFilterBtn').each(function () {
            $(this).remove();
        });
        $(table).find('.HotelGridViewBtn').each(function () {
            $(this).remove();
        });
        $(table).find('input').each(function () {
            $(this).remove();
        });
        for (i = 0; i < hadstontabledata.length; i++) {
            var columntr = $("<tr style='border: 1px solid black;border-collapse: collapse'></tr>");
            for (j = 0; j < hadstontabledata[i].length;++j)
            {
                var rowtd = $("<td style='border: 1px solid black;border-collapse: collapse'></td>").html(hadstontabledata[i][j]);
                columntr.append(rowtd)
            }
            table.append(columntr);
        }

        $('#ForEmail').append(table);
    }
    function UpdateFormProp(LineNo, VendorID, Instance, row)
    {
        if (LineNo == 1) {
            Instance.getData()[row].FirstPayment = $("#AuthorizedAmount").val();
            Instance.getData()[row].DateFirstPayment = $("#Date").val();
            Instance.render();
        }
        if (LineNo == 2) {
            Instance.getData()[row].SecondPayment = $("#AuthorizedAmount").val();
            Instance.getData()[row].DateSecondPayment = $("#Date").val();
            Instance.render();
        }
        if (LineNo == 3) {
            Instance.getData()[row].ThirdPayment = $("#AuthorizedAmount").val();
            Instance.getData()[row].DateThirdPayment = $("#Date").val();
            Instance.render();
        }
    }
    // Hotel Grid column Hide Unhide
    function HotelGridColumnHideUnhide(element) {
        var column = $(element).attr('id');
        switch(column)
        {
            case "HotelGridGroupStatusView":
                {
                    if (HotelModel[0].ViewGroupStatus == true)
                        HotelModel[0].ViewGroupStatus = false;
                    else
                        HotelModel[0].ViewGroupStatus = true;
                }
                break;
            case "HotelGridVendorStatusView":
                {
                    if (HotelModel[0].ViewVendorStatus == true)
                        HotelModel[0].ViewVendorStatus = false;
                    else
                        HotelModel[0].ViewVendorStatus = true;
                }
                break;
            case "HotelGridGroupCodeView":
                {
                    if (HotelModel[0].ViewGroupCode == true)
                        HotelModel[0].ViewGroupCode = false;
                    else
                        HotelModel[0].ViewGroupCode = true;
                }
                break;
            case "HotelGridGroupNameView":
                {
                    if (HotelModel[0].ViewGroupName == true)
                        HotelModel[0].ViewGroupName = false;
                    else
                        HotelModel[0].ViewGroupName = true;
                }
                break;
            case "HotelGridCustomerCodeView":
                {
                    if (HotelModel[0].ViewCustomerCode == true)
                        HotelModel[0].ViewCustomerCode = false;
                    else
                        HotelModel[0].ViewCustomerCode = true;
                }
                break;
            case "HotelGridPaxView":
                {
                    if (HotelModel[0].ViewPax == true)
                        HotelModel[0].ViewPax = false;
                    else
                        HotelModel[0].ViewPax = true;
                }
                break;
            case "HotelGridArrivalDateView":
                {
                    if (HotelModel[0].ViewArrivalDate == true)
                        HotelModel[0].ViewArrivalDate = false;
                    else
                        HotelModel[0].ViewArrivalDate = true;
                }
                break;
            case "HotelGridArrivalCityView":
                {
                    if (HotelModel[0].ViewArrivalCity == true)
                        HotelModel[0].ViewArrivalCity = false;
                    else
                        HotelModel[0].ViewArrivalCity = true;
                }
                break;
            case "HotelGridDepartureDateView":
                {
                    if (HotelModel[0].ViewDepartureDate == true)
                        HotelModel[0].ViewDepartureDate = false;
                    else
                        HotelModel[0].ViewDepartureDate = true;
                }
                break;
            case "HotelGridFileCompDaysView":
                {
                    if (HotelModel[0].ViewFileCompDays == true)
                        HotelModel[0].ViewFileCompDays = false;
                    else
                        HotelModel[0].ViewFileCompDays = true;
                }
                break;
            case "HotelGridRoomCountView":
                {
                    if (HotelModel[0].ViewRoomCount == true)
                        HotelModel[0].ViewRoomCount = false;
                    else
                        HotelModel[0].ViewRoomCount = true;
                }
                break;
            case "HotelGridEmployeeView":
                {
                    if (HotelModel[0].ViewEmployee == true)
                        HotelModel[0].ViewEmployee = false;
                    else
                        HotelModel[0].ViewEmployee = true;
                }
                break;
            case "HotelGridNightsView":
                {
                    if (HotelModel[0].ViewNights == true)
                        HotelModel[0].ViewNights = false;
                    else
                        HotelModel[0].ViewNights = true;
                }
                break;
            case "HotelGridTotalCostView":
                {
                    if (HotelModel[0].ViewTotalCost == true)
                        HotelModel[0].ViewTotalCost = false;
                    else
                        HotelModel[0].ViewTotalCost = true;
                }
                break;
            case "HotelGridBreakDownTotalView":
                {
                    if (HotelModel[0].ViewBreakDownTotal == true)
                        HotelModel[0].ViewBreakDownTotal = false;
                    else
                        HotelModel[0].ViewBreakDownTotal = true;
                }
                break;
            case "HotelGridOutstandingBalanceView":
                {
                    if (HotelModel[0].ViewOutstandingBalance == true)
                        HotelModel[0].ViewOutstandingBalance = false;
                    else
                        HotelModel[0].ViewOutstandingBalance = true;
                }
                break;
            case "HotelGridComAmountView":
                {
                    if (HotelModel[0].ViewComAmount == true)
                        HotelModel[0].ViewComAmount = false;
                    else
                        HotelModel[0].ViewComAmount = true;
                }
                break;
            case "HotelGridComAmountView":
                {
                    if (HotelModel[0].ViewComAmount == true)
                        HotelModel[0].ViewComAmount = false;
                    else
                        HotelModel[0].ViewComAmount = true;
                }
                break;
            case "HotelGridComDifferenceView":
                {
                    if (HotelModel[0].ViewComDifference == true)
                        HotelModel[0].ViewComDifference = false;
                    else
                        HotelModel[0].ViewComDifference = true;
                }
                break;
            case "HotelGridCurrencyView":
                {
                    if (HotelModel[0].ViewCurrency == true)
                        HotelModel[0].ViewCurrency = false;
                    else
                        HotelModel[0].ViewCurrency = true;
                }
                break;
            case "HotelGridTotalInvoiceView":
                {
                    if (HotelModel[0].ViewTotalInvoice == true)
                        HotelModel[0].ViewTotalInvoice = false;
                    else
                        HotelModel[0].ViewTotalInvoice = true;
                }
                break;
            case "HotelGridTotalPaidView":
                {
                    if (HotelModel[0].ViewTotalPaid == true)
                        HotelModel[0].ViewTotalPaid = false;
                    else
                        HotelModel[0].ViewTotalPaid = true;
                }
                break;
            case "HotelGridFirstPaymentView":
                {
                    if (HotelModel[0].ViewFirstPayment == true)
                        HotelModel[0].ViewFirstPayment = false;
                    else
                        HotelModel[0].ViewFirstPayment = true;
                }
                break;
            case "HotelGridFirstPaymentMethodView":
                {
                    if (HotelModel[0].ViewFirstPaymentMethod == true)
                        HotelModel[0].ViewFirstPaymentMethod = false;
                    else
                        HotelModel[0].ViewFirstPaymentMethod = true;
                }
                break;
            case "HotelGridDateFirstPaymentView":
                {
                    if (HotelModel[0].ViewDateFirstPayment == true)
                        HotelModel[0].ViewDateFirstPayment = false;
                    else
                        HotelModel[0].ViewDateFirstPayment = true;
                }
                break;
            case "HotelGridSecondPaymentView":
                {
                    if (HotelModel[0].ViewSecondPayment == true)
                        HotelModel[0].ViewSecondPayment = false;
                    else
                        HotelModel[0].ViewSecondPayment = true;
                }
                break;
            case "HotelGridSecondPaymentMethodView":
                {
                    if (HotelModel[0].ViewSecondPaymentMethod == true)
                        HotelModel[0].ViewSecondPaymentMethod = false;
                    else
                        HotelModel[0].ViewSecondPaymentMethod = true;
                }
                break;
            case "HotelGridDateSecondPaymentView":
                {
                    if (HotelModel[0].ViewDateSecondPayment == true)
                        HotelModel[0].ViewDateSecondPayment = false;
                    else
                        HotelModel[0].ViewDateSecondPayment = true;
                }
                break;
            case "HotelGridThirdPaymentView":
                {
                    if (HotelModel[0].ViewThirdPayment == true)
                        HotelModel[0].ViewThirdPayment = false;
                    else
                        HotelModel[0].ViewThirdPayment = true;
                }
                break;
            case "HotelGridThirdPaymentMethodView":
                {
                    if (HotelModel[0].ViewThirdPaymentMethod == true)
                        HotelModel[0].ViewThirdPaymentMethod = false;
                    else
                        HotelModel[0].ViewThirdPaymentMethod = true;
                }
                break;
            case "HotelGridDateThirdPaymentView":
                {
                    if (HotelModel[0].ViewDateThirdPayment == true)
                        HotelModel[0].ViewDateThirdPayment = false;
                    else
                        HotelModel[0].ViewDateThirdPayment = true;
                }
                break;
            case "HotelGridRefundReceivedHotelView":
                {
                    if (HotelModel[0].ViewRefundReceivedHotel == true)
                        HotelModel[0].ViewRefundReceivedHotel = false;
                    else
                        HotelModel[0].ViewRefundReceivedHotel = true;
                }
                break;
            case "HotelGridTotalChargedView":
                {
                    if (HotelModel[0].ViewTotalCharged == true)
                        HotelModel[0].ViewTotalCharged = false;
                    else
                        HotelModel[0].ViewTotalCharged = true;
                }
                break;
            case "HotelGridAuthDiffView":
                {
                    if (HotelModel[0].ViewAuthDiff == true)
                        HotelModel[0].ViewAuthDiff = false;
                    else
                        HotelModel[0].ViewAuthDiff = true;
                }
                break;
            case "HotelGridAccountingMemoView":
                {
                    if (HotelModel[0].ViewAccountingMemo == true)
                        HotelModel[0].ViewAccountingMemo = false;
                    else
                        HotelModel[0].ViewAccountingMemo = true;
                }
                break;
            case "HotelGridCommissionStatusView":
                {
                    if (HotelModel[0].ViewCommissionStatus == true)
                        HotelModel[0].ViewCommissionStatus = false;
                    else
                        HotelModel[0].ViewCommissionStatus = true;
                }
                break;
            case "HotelGridCommissionPrcView":
                {
                    if (HotelModel[0].ViewCommissionPrc == true)
                        HotelModel[0].ViewCommissionPrc = false;
                    else
                        HotelModel[0].ViewCommissionPrc = true;
                }
                break;
            case "HotelGridCommissionReceivedView":
                {
                    if (HotelModel[0].ViewCommissionReceived == true)
                        HotelModel[0].ViewCommissionReceived = false;
                    else
                        HotelModel[0].ViewCommissionReceived = true;
                }
                break;
            case "HotelGridCommissionDateReceivedView":
                {
                    if (HotelModel[0].ViewCommissionDateReceived == true)
                        HotelModel[0].ViewCommissionDateReceived = false;
                    else
                        HotelModel[0].ViewCommissionDateReceived = true;
                }
                break;
            case "HotelGridCheckNumberView":
                {
                    if (HotelModel[0].ViewCheckNumber == true)
                        HotelModel[0].ViewCheckNumber = false;
                    else
                        HotelModel[0].ViewCheckNumber = true;
                }
                break;
            case "HotelGridCheckAmountView":
                {
                    if (HotelModel[0].ViewCheckAmount == true)
                        HotelModel[0].ViewCheckAmount = false;
                    else
                        HotelModel[0].ViewCheckAmount = true;
                }
                break;
            case "HotelGridSGLCountView":
                {
                    if (HotelModel[0].ViewSGLCount == true)
                        HotelModel[0].ViewSGLCount = false;
                    else
                        HotelModel[0].ViewSGLCount = true;
                }
                break;
            case "HotelGridSGLAmountView":
                {
                    if (HotelModel[0].ViewSGLAmount == true)
                        HotelModel[0].ViewSGLAmount = false;
                    else
                        HotelModel[0].ViewSGLAmount = true;
                }
                break;
            case "HotelGridDBLCountView":
                {
                    if (HotelModel[0].ViewDBLCount == true)
                        HotelModel[0].ViewDBLCount = false;
                    else
                        HotelModel[0].ViewDBLCount = true;
                }
                break;
            case "HotelGridDBLAmountView":
                {
                    if (HotelModel[0].ViewDBLAmount == true)
                        HotelModel[0].ViewDBLAmount = false;
                    else
                        HotelModel[0].ViewDBLAmount = true;
                }
                break;
            case "HotelGridTWNCountView":
                {
                    if (HotelModel[0].ViewTWNCount == true)
                        HotelModel[0].ViewTWNCount = false;
                    else
                        HotelModel[0].ViewTWNCount = true;
                }
                break;
            case "HotelGridTWNAmountView":
                {
                    if (HotelModel[0].ViewTWNAmount == true)
                        HotelModel[0].ViewTWNAmount = false;
                    else
                        HotelModel[0].ViewTWNAmount = true;
                }
                break;
            case "HotelGridTRPLCountView":
                {
                    if (HotelModel[0].ViewTRPLCount == true)
                        HotelModel[0].ViewTRPLCount = false;
                    else
                        HotelModel[0].ViewTRPLCount = true;
                }
                break;
            case "HotelGridTRPLAmountView":
                {
                    if (HotelModel[0].ViewTRPLAmount == true)
                        HotelModel[0].ViewTRPLAmount = false;
                    else
                        HotelModel[0].ViewTRPLAmount = true;
                }
                break;
            case "HotelGridQUDCountView":
                {
                    if (HotelModel[0].ViewQUDCount == true)
                        HotelModel[0].ViewQUDCount = false;
                    else
                        HotelModel[0].ViewQUDCount = true;
                }
                break;
            case "HotelGridQUDAmountView":
                {
                    if (HotelModel[0].ViewQUDAmount == true)
                        HotelModel[0].ViewQUDAmount = false;
                    else
                        HotelModel[0].ViewQUDAmount = true;
                }
                break;
            case "HotelGridGuideCountView":
                {
                    if (HotelModel[0].ViewGuideCount == true)
                        HotelModel[0].ViewGuideCount = false;
                    else
                        HotelModel[0].ViewGuideCount = true;
                }
                break;
            case "HotelGridGuideAmountView":
                {
                    if (HotelModel[0].ViewGuideAmount == true)
                        HotelModel[0].ViewGuideAmount = false;
                    else
                        HotelModel[0].ViewGuideAmount = true;
                }
                break;
            case "HotelGridDriverCountView":
                {
                    if (HotelModel[0].ViewDriverCount == true)
                        HotelModel[0].ViewDriverCount = false;
                    else
                        HotelModel[0].ViewDriverCount = true;
                }
                break;
            case "HotelGridDriverAmountView":
                {
                    if (HotelModel[0].ViewDriverAmount == true)
                        HotelModel[0].ViewDriverAmount = false;
                    else
                        HotelModel[0].ViewDriverAmount = true;
                }
                break;
            case "HotelGridTaxPrcView":
                {
                    if (HotelModel[0].ViewTaxPrc == true)
                        HotelModel[0].ViewTaxPrc = false;
                    else
                        HotelModel[0].ViewTaxPrc = true;
                }
                break;
            case "HotelGridOccTaxView":
                {
                    if (HotelModel[0].ViewOccTax == true)
                        HotelModel[0].ViewOccTax = false;
                    else
                        HotelModel[0].ViewOccTax = true;
                }
                break;
            case "HotelGridCBFView":
                {
                    if (HotelModel[0].ViewCBF == true)
                        HotelModel[0].ViewCBF = false;
                    else
                        HotelModel[0].ViewCBF = true;
                }
                break;
            case "HotelGridABFView":
                {
                    if (HotelModel[0].ViewABF == true)
                        HotelModel[0].ViewABF = false;
                    else
                        HotelModel[0].ViewABF = true;
                }
                break;
            case "HotelGridVConfHtmlView":
                {
                    if (HotelModel[0].ViewVConfHtml == true)
                        HotelModel[0].ViewVConfHtml = false;
                    else
                        HotelModel[0].ViewVConfHtml = true;
                }
                break;
            case "HotelGridBagView":
                {
                    if (HotelModel[0].ViewBag == true)
                        HotelModel[0].ViewBag = false;
                    else
                        HotelModel[0].ViewBag = true;
                }
                break;
            case "HotelGridLunchView":
                {
                    if (HotelModel[0].ViewLunch == true)
                        HotelModel[0].ViewLunch = false;
                    else
                        HotelModel[0].ViewLunch = true;
                }
                break;
            case "HotelGridDinnerView":
                {
                    if (HotelModel[0].ViewDinner == true)
                        HotelModel[0].ViewDinner = false;
                    else
                        HotelModel[0].ViewDinner = true;
                }
                break;
            case "HotelGridCompView":
                {
                    if (HotelModel[0].ViewComp == true)
                        HotelModel[0].ViewComp = false;
                    else
                        HotelModel[0].ViewComp = true;
                }
                break;
            case "HotelGridExtraCostView":
                {
                    if (HotelModel[0].ViewExtraCost == true)
                        HotelModel[0].ViewExtraCost = false;
                    else
                        HotelModel[0].ViewExtraCost = true;
                }
                break;
            case "HotelGridXLTDateView":
                {
                    if (HotelModel[0].ViewXLTDate == true)
                        HotelModel[0].ViewXLTDate = false;
                    else
                        HotelModel[0].ViewXLTDate = true;
                }
                break;
            case "HotelGridDateFileReceivedView":
                {
                    if (HotelModel[0].ViewDateFileReceived == true)
                        HotelModel[0].ViewDateFileReceived = false;
                    else
                        HotelModel[0].ViewDateFileReceived = true;
                }
                break;
            case "HotelGridDateFileCompletedView":
                {
                    if (HotelModel[0].ViewDateFileCompleted == true)
                        HotelModel[0].ViewDateFileCompleted = false;
                    else
                        HotelModel[0].ViewDateFileCompleted = true;
                }
                break;
            case "HotelGridDayOfArrivalView":
                {
                    if (HotelModel[0].ViewDayOfArrival == true)
                        HotelModel[0].ViewDayOfArrival = false;
                    else
                        HotelModel[0].ViewDayOfArrival = true;
                }
                break;
            case "HotelGridMonthOfArrivalView":
                {
                    if (HotelModel[0].ViewMonthOfArrival == true)
                        HotelModel[0].ViewMonthOfArrival = false;
                    else
                        HotelModel[0].ViewMonthOfArrival = true;
                }
                break;
            case "HotelGridClientBookingCodeView":
                {
                    if (HotelModel[0].ViewClientBookingCode == true)
                        HotelModel[0].ViewClientBookingCode = false;
                    else
                        HotelModel[0].ViewClientBookingCode = true;
                }
                break;
            case "HotelGridCheckInDateView":
                {
                    if (HotelModel[0].ViewCheckInDate == true)
                        HotelModel[0].ViewCheckInDate = false;
                    else
                        HotelModel[0].ViewCheckInDate = true;
                }
                break;
            case "HotelGridCheckOutDateView":
                {
                    if (HotelModel[0].ViewCheckOutDate == true)
                        HotelModel[0].ViewCheckOutDate = false;
                    else
                        HotelModel[0].ViewCheckOutDate = true;
                }
                break;
            case "HotelGridEstimatedNumberPaxView":
                {
                    if (HotelModel[0].ViewEstimatedNumberPax == true)
                        HotelModel[0].ViewEstimatedNumberPax = false;
                    else
                        HotelModel[0].ViewEstimatedNumberPax = true;
                }
                break;
            case "HotelGridEstimatedNumberRoomsView":
                {
                    if (HotelModel[0].ViewEstimatedNumberRooms == true)
                        HotelModel[0].ViewEstimatedNumberRooms = false;
                    else
                        HotelModel[0].ViewEstimatedNumberRooms = true;
                }
                break;
            case "HotelGridQuotaRoomDiffView":
                {
                    if (HotelModel[0].ViewQuotaRoomDiff == true)
                        HotelModel[0].ViewQuotaRoomDiff = false;
                    else
                        HotelModel[0].ViewQuotaRoomDiff = true;
                }
                break;
            case "HotelGridQuotaRoomView":
                {
                    if (HotelModel[0].ViewQuotaRoom == true)
                        HotelModel[0].ViewQuotaRoom = false;
                    else
                        HotelModel[0].ViewQuotaRoom = true;
                }
                break;
            case "HotelGridQuotaTaxView":
                {
                    if (HotelModel[0].ViewQuotaTax == true)
                        HotelModel[0].ViewQuotaTax = false;
                    else
                        HotelModel[0].ViewQuotaTax = true;
                }
                break;
            case "HotelGridQuotaOccTaxView":
                {
                    if (HotelModel[0].ViewQuotaOccTax == true)
                        HotelModel[0].ViewQuotaOccTax = false;
                    else
                        HotelModel[0].ViewQuotaOccTax = true;
                }
                break;
            case "HotelGridQuotaBrkView":
                {
                    if (HotelModel[0].ViewQuotaBrk == true)
                        HotelModel[0].ViewQuotaBrk = false;
                    else
                        HotelModel[0].ViewQuotaBrk = true;
                }
                break;
            case "HotelGridQuotaLgView":
                {
                    if (HotelModel[0].ViewQuotaLg == true)
                        HotelModel[0].ViewQuotaLg = false;
                    else
                        HotelModel[0].ViewQuotaLg = true;
                }
                break;
            case "HotelGridQuotaNightView":
                {
                    if (HotelModel[0].ViewQuotaNight == true)
                        HotelModel[0].ViewQuotaNight = false;
                    else
                        HotelModel[0].ViewQuotaNight = true;
                }
                break;
            case "HotelGridQuotaVendorNameView":
                {
                    if (HotelModel[0].ViewQuotaVendorName == true)
                        HotelModel[0].ViewQuotaVendorName = false;
                    else
                        HotelModel[0].ViewQuotaVendorName = true;
                }
                break;
            case "HotelGridQuotaNoteView":
                {
                    if (HotelModel[0].ViewQuotaNote == true)
                        HotelModel[0].ViewQuotaNote = false;
                    else
                        HotelModel[0].ViewQuotaNote = true;
                }
                break;
            case "HotelGridConfirmedView":
                {
                    if (HotelModel[0].ViewConfirmed == true)
                        HotelModel[0].ViewConfirmed = false;
                    else
                        HotelModel[0].ViewConfirmed = true;
                }
                break;
            case "HotelGridVendorNameView":
                {
                    if (HotelModel[0].ViewVendorName == true)
                        HotelModel[0].ViewVendorName = false;
                    else
                        HotelModel[0].ViewVendorName = true;
                }
                break;
            case "HotelGridVendorAddressView":
                {
                    if (HotelModel[0].ViewVendorAddress == true)
                        HotelModel[0].ViewVendorAddress = false;
                    else
                        HotelModel[0].ViewVendorAddress = true;
                }
                break;
            case "HotelGridVendorPhoneView":
                {
                    if (HotelModel[0].ViewVendorPhone == true)
                        HotelModel[0].ViewVendorPhone = false;
                    else
                        HotelModel[0].ViewVendorPhone = true;
                }
                break;
            case "HotelGridVendorEmailView":
                {
                    if (HotelModel[0].ViewVendorEmail == true)
                        HotelModel[0].ViewVendorEmail = false;
                    else
                        HotelModel[0].ViewVendorEmail = true;
                }
                break;
            case "HotelGridVendorContactNameView":
                {
                    if (HotelModel[0].ViewVendorContactName == true)
                        HotelModel[0].ViewVendorContactName = false;
                    else
                        HotelModel[0].ViewVendorContactName = true;
                }
                break;
            case "HotelGridVendorCityView":
                {
                    if (HotelModel[0].ViewVendorCity == true)
                        HotelModel[0].ViewVendorCity = false;
                    else
                        HotelModel[0].ViewVendorCity = true;
                }
                break;
            case "HotelGridVendorTechView":
                {
                    if (HotelModel[0].ViewVendorTech == true)
                        HotelModel[0].ViewVendorTech = false;
                    else
                        HotelModel[0].ViewVendorTech = true;
                }
                break;
            case "HotelGridVendorNoteView":
                {
                    if (HotelModel[0].ViewVendorNote == true)
                        HotelModel[0].ViewVendorNote = false;
                    else
                        HotelModel[0].ViewVendorNote = true;
                }
                break;
            default:
                break;
        }
        LoadHotelGrid(true);
    };

    function AutoCopyCols(instance, row, VndElem, CopyRowStart)
    {
       
        // Vendor Info auto copy
        instance.getData()[row].VendorCity = VndElem.VendorCity;
        instance.getData()[row].VendorAddress = VndElem.VendorAddress;
        instance.getData()[row].VendorPhone = VndElem.VendorPhone;
        instance.getData()[row].VendorEmail = VndElem.VendorEmail;
        instance.getData()[row].VendorContactName = VndElem.VendorContactPerson;
        instance.getData()[row].NewVendorID = VndElem.VendorID;
        if (instance.getData()[row].GroupID == null && CopyRowStart != null) {
            // new row
            instance.getData()[row].QuotaTax = instance.getData()[CopyRowStart].QuotaTax;
            instance.getData()[row].QuotaRoom = instance.getData()[CopyRowStart].QuotaRoom;
            instance.getData()[row].QuotaOccTax = instance.getData()[CopyRowStart].QuotaOccTax;
            instance.getData()[row].QuotaBrk = instance.getData()[CopyRowStart].QuotaBrk;
            instance.getData()[row].QuotaLg = instance.getData()[CopyRowStart].QuotaLg;
            instance.getData()[row].QuotaNight = instance.getData()[CopyRowStart].QuotaNight;
            instance.getData()[row].QuotaVendorName = instance.getData()[CopyRowStart].QuotaVendorName;
            instance.getData()[row].QuotaNote = instance.getData()[CopyRowStart].QuotaNote;
            instance.getData()[row].GroupCode = instance.getData()[CopyRowStart].GroupCode;
            instance.getData()[row].GroupID = instance.getData()[CopyRowStart].GroupID;
            instance.getData()[row].GroupName = instance.getData()[CopyRowStart].GroupName;
            instance.getData()[row].CustomerCode = instance.getData()[CopyRowStart].CustomerCode;
            instance.getData()[row].RoomCount = instance.getData()[CopyRowStart].RoomCount;
            instance.getData()[row].SelectedEmployee = instance.getData()[CopyRowStart].SelectedEmployee;
            instance.getData()[row].DateFileReceived = instance.getData()[CopyRowStart].DateFileReceived;
            instance.getData()[row].DateFileCompleted = instance.getData()[CopyRowStart].DateFileCompleted;
            instance.getData()[row].ArrivalDate = instance.getData()[CopyRowStart].ArrivalDate;
            instance.getData()[row].DepartureDate = instance.getData()[CopyRowStart].DepartureDate;
            instance.getData()[row].DayOfArrival = instance.getData()[CopyRowStart].DayOfArrival;
            instance.getData()[row].MonthOfArrival = instance.getData()[CopyRowStart].MonthOfArrival;
            instance.getData()[row].SelectedGroupStatus = instance.getData()[CopyRowStart].SelectedGroupStatus;
            instance.getData()[row].SelectedVendorStatus = HotelModel[0].VendorStatus[0].Text;
            //  instance.getData()[row].QuotaTax = instance.getData()[VendorNameCopyRow].QuotaTax;
        }

    }
    // Save Hotel Grid Data
    function HotelGridSave() {
        
        var Rows = $('#OperHotelGrid').data('handsontable').getData();
        var SelectedFilterCustomerCode = [];
        $('#HotelGridCustomerCodeMainDiv input[name=SelectedFilterCustomerCode]:checked').each(function () {
            SelectedFilterCustomerCode.push($(this).val());
        });
        var SelectedFilterGroupCode = [];
        $('#HotelGridGroupCodeMainDiv input[name=SelectedFilterGroupCode]:checked').each(function () {
            SelectedFilterGroupCode.push($(this).val());
        });
        var SelectedFilterGroupName = [];
        $('#HotelGridGroupNameMainDiv input[name=SelectedFilterGroupName]:checked').each(function () {
            SelectedFilterGroupName.push($(this).val());
        });
        var SelectedFilterVendorName = [];
        $('#HotelGridVendorNameMainDiv input[name=SelectedFilterVendorName]:checked').each(function () {
            SelectedFilterVendorName.push($(this).val());
        });
        var SelectedFilterVendorCity = [];
        $('#HotelGridVendorCityMainDiv input[name=SelectedFilterVendorCity]:checked').each(function () {
            SelectedFilterVendorCity.push($(this).val());
        });
        var SelectedFilterStatus = [];
        $('#HotelGridStatusMainDiv input[name=SelectedFilterStatus]:checked').each(function () {
            SelectedFilterStatus.push($(this).val());
        });
        var SelectedFilterGroupStatus = [];
        $('#HotelGridGroupStatusMainDiv input[name=SelectedFilterGroupStatus]:checked').each(function () {
            SelectedFilterGroupStatus.push($(this).val());
        });
        var SelectedFilterArrivalCity = [];
        $('#HotelGridArrivalCityMainDiv input[name=SelectedFilterArrivalCity]:checked').each(function () {
            SelectedFilterArrivalCity.push($(this).val());
        });
        var SelectedFilterEstNumberRoom = [];
        $('#HotelGridEstNumberRoomMainDiv input[name=SelectedFilterEstNumberRoom]:checked').each(function () {
            SelectedFilterEstNumberRoom.push($(this).val());
        });
        var SelectedFilterDayofArrival = [];
        $('#HotelGridDayofArrivalDiv input[name=SelectedFilterDayofArrival]:checked').each(function () {
            SelectedFilterDayofArrival.push($(this).val());
        });
        var SelectedFilterMonthofArrival = [];
        $('#HotelGridMonthofArrivalDiv input[name=SelectedFilterMonthofArrival]:checked').each(function () {
            SelectedFilterMonthofArrival.push($(this).val());
        });
        var OperationHotelGridViewModel = {
            SaveRows: [],
            // show hide
            ViewGroupStatus: HotelModel[0].ViewGroupStatus,
            ViewVendorStatus: HotelModel[0].ViewVendorStatus,
            ViewGroupCode: HotelModel[0].ViewGroupCode,
            ViewGroupName: HotelModel[0].ViewGroupName,
            ViewArrivalDate: HotelModel[0].ViewArrivalDate,
            ViewArrivalCity: HotelModel[0].ViewArrivalCity,
            ViewCustomerCode: HotelModel[0].ViewCustomerCode,
            ViewPax: HotelModel[0].ViewPax,
            ViewDepartureDate: HotelModel[0].ViewDepartureDate,
            ViewRoomCount: HotelModel[0].ViewRoomCount,
            ViewEmployee: HotelModel[0].ViewEmployee,
            ViewNights: HotelModel[0].ViewNights,
            ViewFileCompDays: HotelModel[0].ViewFileCompDays,
            ViewTotalCost: HotelModel[0].ViewTotalCost,
            ViewFileCompDays: HotelModel[0].ViewFileCompDays,
            ViewBreakDownTotal: HotelModel[0].ViewBreakDownTotal,
            ViewOutstandingBalance: HotelModel[0].ViewOutstandingBalance,
            ViewComAmount: HotelModel[0].ViewComAmount,
            ViewComDifference: HotelModel[0].ViewComDifference,
            ViewCurrency: HotelModel[0].ViewCurrency,
            ViewTotalInvoice: HotelModel[0].ViewTotalInvoice,
            ViewTotalPaid: HotelModel[0].ViewTotalPaid,
            ViewFirstPayment: HotelModel[0].ViewFirstPayment,
            ViewFirstPaymentMethod: HotelModel[0].ViewFirstPaymentMethod,
            ViewDateFirstPayment: HotelModel[0].ViewDateFirstPayment,
            ViewSecondPayment: HotelModel[0].ViewSecondPayment,
            ViewSecondPaymentMethod: HotelModel[0].ViewSecondPaymentMethod,
            ViewDateSecondPayment: HotelModel[0].ViewDateSecondPayment,
            ViewThirdPayment: HotelModel[0].ViewThirdPayment,
            ViewThirdPaymentMethod: HotelModel[0].ViewThirdPaymentMethod,
            ViewDateThirdPayment: HotelModel[0].ViewDateThirdPayment,
            ViewRefundReceivedHotel: HotelModel[0].ViewRefundReceivedHotel,
            ViewTotalCharged: HotelModel[0].ViewTotalCharged,
            ViewAuthDiff: HotelModel[0].ViewAuthDiff,
            ViewAccountingMemo: HotelModel[0].ViewAccountingMemo,
            ViewCommissionStatus: HotelModel[0].ViewCommissionStatus,
            ViewCommissionPrc: HotelModel[0].ViewCommissionPrc,
            ViewCommissionReceived: HotelModel[0].ViewCommissionReceived,
            ViewCommissionDateReceived: HotelModel[0].ViewCommissionDateReceived,
            ViewCheckNumber: HotelModel[0].ViewCheckNumber,
            ViewCheckAmount: HotelModel[0].ViewCheckAmount,
            ViewSGLCount: HotelModel[0].ViewSGLCount,
            ViewSGLAmount: HotelModel[0].ViewSGLAmount,
            ViewDBLCount: HotelModel[0].ViewDBLCount,
            ViewDBLAmount: HotelModel[0].ViewDBLAmount,
            ViewTWNCount: HotelModel[0].ViewTWNCount,
            ViewTWNAmount: HotelModel[0].ViewTWNAmount,
            ViewTRPLCount: HotelModel[0].ViewTRPLCount,
            ViewTRPLAmount: HotelModel[0].ViewTRPLAmount,
            ViewQUDCount: HotelModel[0].ViewQUDCount,
            ViewQUDAmount: HotelModel[0].ViewQUDAmount,
            ViewGuideCount: HotelModel[0].ViewGuideCount,
            ViewGuideAmount: HotelModel[0].ViewGuideAmount,
            ViewDriverCount: HotelModel[0].ViewDriverCount,
            ViewDriverAmount: HotelModel[0].ViewDriverAmount,
            ViewTaxPrc: HotelModel[0].ViewTaxPrc,
            ViewOccTax: HotelModel[0].ViewOccTax,
            ViewCBF: HotelModel[0].ViewCBF,
            ViewABF: HotelModel[0].ViewABF,
            ViewVConfHtml: HotelModel[0].ViewVConfHtml,
            ViewBag: HotelModel[0].ViewBag,
            ViewLunch: HotelModel[0].ViewLunch,
            ViewDinner: HotelModel[0].ViewDinner,
            ViewComp: HotelModel[0].ViewComp,
            ViewExtraCost: HotelModel[0].ViewExtraCost,
            ViewXLTDate: HotelModel[0].ViewXLTDate,
            ViewDateFileReceived: HotelModel[0].ViewDateFileReceived,
            ViewDateFileCompleted: HotelModel[0].ViewDateFileCompleted,
            ViewDayOfArrival: HotelModel[0].ViewDayOfArrival,
            ViewMonthOfArrival: HotelModel[0].ViewMonthOfArrival,
            ViewClientBookingCode: HotelModel[0].ViewClientBookingCode,
            ViewCheckInDate: HotelModel[0].ViewCheckInDate,
            ViewCheckOutDate: HotelModel[0].ViewCheckOutDate,
            ViewEstimatedNumberPax: HotelModel[0].ViewEstimatedNumberPax,
            ViewEstimatedNumberRooms: HotelModel[0].ViewEstimatedNumberRooms,
            ViewQuotaRoom: HotelModel[0].ViewQuotaRoom,
            ViewQuotaRoomDiff: HotelModel[0].ViewQuotaRoomDiff,
            ViewQuotaTax: HotelModel[0].ViewQuotaTax,
            ViewQuotaOccTax: HotelModel[0].ViewQuotaOccTax,
            ViewQuotaBrk: HotelModel[0].ViewQuotaBrk,
            ViewQuotaLg: HotelModel[0].ViewQuotaLg,
            ViewQuotaNight: HotelModel[0].ViewQuotaNight,
            ViewQuotaVendorName: HotelModel[0].ViewQuotaVendorName,
            ViewQuotaNote: HotelModel[0].ViewQuotaNote,
            ViewConfirmed: HotelModel[0].ViewConfirmed,
            ViewVendorName: HotelModel[0].ViewVendorName,
            ViewVendorAddress: HotelModel[0].ViewVendorAddress,
            ViewVendorPhone: HotelModel[0].ViewVendorPhone,
            ViewVendorEmail: HotelModel[0].ViewVendorEmail,
            ViewVendorContactName: HotelModel[0].ViewVendorContactName,
            ViewVendorCity: HotelModel[0].ViewVendorCity,
            ViewVendorTech: HotelModel[0].ViewVendorTech,
            ViewVendorNote: HotelModel[0].ViewVendorNote,
            // search part
            SearchCheckInFromDate: $("#SearchCheckInFromDate").val(),
            SearchCheckInToDate: $("#SearchCheckInToDate").val(),
            SearchCheckOutFromDate: $("#SearchCheckOutFromDate").val(),
            SearchCheckOutToDate: $("#SearchCheckOutToDate").val(),
            SelectedSearchArrivalCity: $("#SelectedSearchArrivalCity").val(),
            SelectedSearchDepartureCity: $("#SelectedSearchDepartureCity").val(),
            SelectedSearchNationality: $("#SelectedSearchNationality").val(),
            SelectedSearchStatus: $("#SelectedSearchStatus").val(),
            SearchCustomer: $("#SearchCustomer").val(),
            SearchVendorName: $("#SearchVendorName").val(),
            SearchGroupName: $("#SearchGroupName").val(),
            SearchGroupCode: $("#SearchGroupCode").val(),
            SearchFlightNo: $("#SearchFlightNo").val(),
            SearchEmployee: $("#SearchEmployee").val(),
            SearchEmployeeID: $("#SearchEmployeeID").val(),
            // Filter Part
            SelectedFilterCustomerCode: SelectedFilterCustomerCode.length > 0 ? SelectedFilterCustomerCode : [],
            SelectedFilterGroupName: SelectedFilterGroupName.length > 0 ? SelectedFilterGroupName : [],
            SelectedFilterGroupCode: SelectedFilterGroupCode.length > 0 ? SelectedFilterGroupCode : [],
            SelectedFilterArrivalCity: SelectedFilterArrivalCity.length > 0 ? SelectedFilterArrivalCity : [],
            SelectedFilterMonthofArrival: SelectedFilterMonthofArrival.length > 0 ? SelectedFilterMonthofArrival : [],
            SelectedFilterDayofArrival: SelectedFilterDayofArrival.length > 0 ? SelectedFilterDayofArrival : [],
            SelectedFilterVendorCity: SelectedFilterVendorCity.length > 0 ? SelectedFilterVendorCity : [],
            SelectedFilterVendorName: SelectedFilterVendorName.length > 0 ? SelectedFilterVendorName : [],
            SelectedFilterStatus: SelectedFilterStatus.length > 0 ? SelectedFilterStatus : [],
            SelectedFilterEstNumberRoom: SelectedFilterEstNumberRoom.length > 0 ? SelectedFilterEstNumberRoom : [],
            SelectedFilterGroupStatus: SelectedFilterGroupStatus.length > 0 ? SelectedFilterGroupStatus : [],
            // More and Scroll part
            HotelPageNumber: $("#HotelPageNumber").val(),
            IsCanNext: $("#IsCanNext").val(),
            IsCanPrev: $("#IsCanPrev").val(),
            LeftScrollPossition: parseFloat($("#OperHotelGrid").scrollLeft()),
            TopScrollPossition: parseFloat($("#OperHotelGrid").scrollTop()),
        };
        var RowsValidate = $('#OperHotelGrid').find('.htInvalid');
        if (Rows.length > 1) {
            if (RowsValidate.length == 0) {
                $(Rows).each(function (index, elem) {
                    if (index < Rows.length - 1) {
                        var RowItm = {
                            GroupID: elem.GroupID,
                            VendorID: elem.VendorID,
                            NewVendorID: elem.NewVendorID,
                            ArrivalDate: elem.ArrivalDate,
                            DepartureDate: elem.DepartureDate,
                            SelectedGroupStatus: GetIDFromList(HotelModel[0].GroupStatus, elem.SelectedGroupStatus),
                            SelectedVendorStatus: GetIDFromList(HotelModel[0].VendorStatus, elem.SelectedVendorStatus),
                            SelectedEmployeeID: GetIDFromList(HotelModel[0].Employee, elem.SelectedEmployee),
                            ArrivalCity: elem.ArrivalCity,
                            AccountingMemo: elem.AccountingMemo,
                            ClientBookingCode: elem.ClientBookingCode,
                            ExtraCost: elem.ExtraCost,
                            RefundReceivedHotel: elem.RefundReceivedHotel,
                            TotalInvoice: elem.TotalInvoice,
                            TotalCharged: elem.TotalCharged,
                            FirstPayment: elem.FirstPayment,
                            SelectedFirstPaymentMethod: elem.FirstPaymentMethod,
                            DateFirstPayment: elem.DateFirstPayment,
                            SecondPayment: elem.SecondPayment,
                            SelectedSecondPaymentMethod: elem.SecondPaymentMethod,
                            DateSecondPayment: elem.DateSecondPayment,
                            ThirdPayment: elem.ThirdPayment,
                            SelectedThirdPaymentMethod: elem.ThirdPaymentMethod,
                            DateThirdPayment: elem.DateThirdPayment,
                            CommissionPerc: elem.CommissionPrc,
                            CommissionStatus: elem.SelectedCommissionStatus,
                            CommissionRecAmt: elem.CommissionReceived,
                            CommissionRecDate: elem.CommissionDateReceived,
                            CommissionCheckNum: elem.CheckNumber,
                            CommissionCheckAmt: elem.CheckAmount,
                            Luggage: elem.Bag,
                            ABF: elem.ABF,
                            CBF: elem.CBF,
                            Lunch: elem.Lunch,
                            Dinner: elem.Dinner,
                            LuggageChecked: elem.BagChecked,
                            ABFChecked: elem.ABFChecked,
                            CBFChecked: elem.CBFChecked,
                            LunchChecked: elem.LunchChecked,
                            DinnerChecked: elem.DinnerChecked,
                            Tax: elem.TaxPrc,
                            OccTax: elem.OccTax,
                            SingleAmt: elem.SGLAmount,
                            DoubleAmt: elem.DBLAmount,
                            TwinAmt: elem.TWNAmount,
                            TrpAmt: elem.TRPLAmount,
                            QuadAmt: elem.QUDAmount,
                            GuideAmt: elem.GuideAmount,
                            DriverAmt: elem.DriverAmount,
                            Comp: elem.Comp,
                            Notes: elem.VendorNote,
                            BookedUnder: elem.GroupBookedUnder,
                        };
                        OperationHotelGridViewModel.SaveRows.push(RowItm);
                    }
                });
                var DTO = JSON.stringify(OperationHotelGridViewModel);

                $.ajax({
                    url: urls["OperationHotelGridSave"],
                    type: 'POST',
                    contentType: 'application/json; charset=utf-8',
                    data: DTO,
                    success: function (data) {
                        $("#tabHotels").html(data);
                    },
                    error: function (xhr) {
                        //   alert('Error: ' + xhr.statusText);
                    },
                    complete: function () {
                        if ($("#LeftScrollPossition").val() != "") {
                            $("#OperHotelGrid").scrollLeft(parseFloat($("#LeftScrollPossition").val()));
                        }
                        if ($("#TopScrollPossition").val() != "") {
                            $("#OperHotelGrid").scrollTop(parseFloat($("#TopScrollPossition").val()));
                        }
                        if (UrlParam("Roomtab") == "Y") {
                            $("#RoomGridUpSearch").click();
                            $("#tabConfirmation").html("");
                            $("#tabRoomingList").html("");
                            $("#tabInvoice").html("");
                        }
                        //  $("#LoadingDiv").hide();
                        OperTechProgSearch();
                        UpdateGrpProfits();
                    }
                });
            }
            else {
                jAlert("You have invalid data", "Error!");
            }
        }
        else {
            jAlert("You have not any data for save", "Error!");
        }
    }

    function GetIDFromList(List, selItem)
    {
        var RetVal = 0;
        $(List).each(function (index, elem) {
            if (elem.Text == selItem)
                RetVal = parseInt(elem.Value);
        });
        return RetVal;
    }
    function GetVendorElemByVendorName(VndName)
    {
        var Velem = null;
        $(HotelModel[0].VendorInfo).each(function (index, elem) {
            if (elem.VendorName == VndName)
                Velem = elem;
        });
        return Velem;
    }
    function GetVendorElemByVendorID(VendorID) {
        var Velem = null;
        $(HotelModel[0].VendorInfo).each(function (index, elem) {
            if (elem.VendorID == VendorID)
                Velem = elem;
        });
        return Velem;
    }
    // toggle Search params
    function HotelSearchToggle() {
        if ($("#SearchHotelToggleDiv").hasClass("SearchHotelToggleDivMore")) {
            $("#SearchHotelToggleDiv").removeClass("SearchHotelToggleDivMore");
            $("#SearchHotelToggleDiv").addClass("SearchHotelToggleDivLess");
        }
        else {
            $("#SearchHotelToggleDiv").addClass("SearchHotelToggleDivMore");
            $("#SearchHotelToggleDiv").removeClass("SearchHotelToggleDivLess");
        }
        $("#OperSearchHotel").toggle(200);
    };
    function CheckOperHotelDataChanges()
    {
        if (!$("#OperHotelSaveBtn").hasClass("GridDataChanged"))
            $("#OperHotelSaveBtn").addClass("GridDataChanged");
    }
    $(document).on("copy", "#GetSelected", function (e) {
        
        GetSelectedClick();
        var table = $("#ForEmail");
        e.clipboardData.clearData();
        e.clipboardData.setData("text/html", table.html());
        e.preventDefault();
        $("#ForEmail").remove();
        $("#GetSelected").attr('disabled', true);

    });
    function RemoveHotelFilter(element)
    {
        
        var columnFilter = $(element).attr('id');
        switch (columnFilter) {
            case "RemoveCustomerFilter":
                {
                    $("#IsRemoveCustomerCodeFilter").val("True");
                }
                break;
            case "RemoveGroupCodeFilter":
                {
                    $("#IsRemoveGroupCodeFilter").val("True");
                }
                break;
            case "RemoveGroupNameFilter":
                {
                    $("#IsRemoveGroupNameFilter").val("True");
                }
                break;
            case "RemoveVendorNameFilter":
                {
                    $("#IsRemoveVendorNameFilter").val("True");
                }
                break;
            case "RemoveVendorCityFilter":
                {
                    $("#IsRemoveVendorCityFilter").val("True");
                }
                break;
            case "RemoveStatusFilter":
                {
                    $("#IsRemoveStatusFilter").val("True");
                }
                break;
            case "RemoveGroupStatusFilter":
                {
                    $("#IsRemoveGroupStatusFilter").val("True");
                }
                break;
            case "RemoveEstNumberRoomFilter":
                {
                    $("#IsRemoveEstNumberRoomFilter").val("True");
                }
                break;
            case "RemoveDayofArrivalFilter":
                {
                    $("#IsRemoveDayofArrivalFilter").val("True");
                }
                break;
            case "RemoveMonthofArrivalFilter":
                {
                    $("#IsRemoveMonthofArrivalFilter").val("True");
                }
                break;
            default:
                break;
        }
        $("#HotelPageNumber").val(1);
        HotelPageNum = 1;
        $("#IsFilter").val("True");
        isFilter = "True";
        $("#HotelGridUpdate").click();
    }
</script>
<div class="OperationTabsTitleDiv">
    <span class="OperationTabsTitle">Hotel</span>
</div>
<div id="OperationAmexVendorDetailsDiv" style="display:none;"></div>
@using (Ajax.BeginForm("SaveOperationHotelGridData", "Operation", new AjaxOptions() { HttpMethod = "Post", OnComplete = "HotelGridAjaxCompleted", UpdateTargetId = "tabHotels", InsertionMode = InsertionMode.Replace }, new { enctype = "multipart/form-data", id = "OperHotelGridForm" }))
{
    <div id="SearchHotelToggleDiv" class="SearchHotelToggleDivMore" onclick="HotelSearchToggle()"></div>
    <div id="OperSearchHotel" style="display: none; height: 185px; width:1185px; background-color: rgba(128, 128, 128, 0.8); ">
        <div class="pull-right" style="margin-left: 25px; margin-bottom: 15px;">

            <div class="row form-row">
                <div class=" col-lg-3" style="width: 23% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchCheckInFromDate)</span>
                        @Html.TextBoxFor(model => model.SearchCheckInFromDate, new { @class = "form-control SearchDate table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 23% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchCheckInToDate)</span>
                        @Html.TextBoxFor(model => model.SearchCheckInToDate, new { @class = "form-control SearchDate table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 27% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchArrivalCity)</span>
                        @Html.DropDownListFor(x => x.SelectedSearchArrivalCity, new SelectList(Model.SearchArrivalCity, "Value", "Text"), "Select", new { @class = "form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 27% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchDepartureCity)</span>
                        @Html.DropDownListFor(x => x.SelectedSearchDepartureCity, new SelectList(Model.SearchDepartureCity, "Value", "Text"), "Select", new { @class = "form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
            </div>
            <div class="row form-row">
                <div class=" col-lg-3" style="width: 23% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchCheckOutFromDate)</span>
                        @Html.TextBoxFor(model => model.SearchCheckOutFromDate, new { @class = "form-control SearchDate table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 23% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchCheckOutToDate)</span>
                        @Html.TextBoxFor(model => model.SearchCheckOutToDate, new { @class = "form-control SearchDate table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 27% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchCustomer)</span>
                        @Html.TextBoxFor(model => model.SearchCustomer, new { @class = "TxtComplete form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 27% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchNationality)</span>
                        @Html.DropDownListFor(x => x.SelectedSearchNationality, new SelectList(Model.SearchNationality, "Value", "Text"), "Select", new { @class = "form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
            </div>
            <div class="row form-row">
                <div class=" col-lg-3" style="width: 35% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchGroupName)</span>
                        @Html.TextBoxFor(model => model.SearchGroupName, new { @class = "TxtComplete form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 23% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchGroupCode)</span>
                        @Html.TextBoxFor(model => model.SearchGroupCode, new { @class = "TxtComplete form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 27% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchVendorName)</span>
                        @Html.TextBoxFor(model => model.SearchVendorName, new { @class = "TxtComplete form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3" style="width: 15% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchFlightNo)</span>
                        @Html.TextBoxFor(model => model.SearchFlightNo, new { @class = "form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
            </div>
            <div class="row form-row">
                <div class=" col-lg-3" style="width: 23% !important;">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchStatus)</span>
                        @Html.DropDownListFor(x => x.SelectedSearchStatus, new SelectList(Model.SearchStatus, "Value", "Text"), "Select", new { @class = "form-control table_inputs_SmallPadding2 inpputgr" })
                    </div>
                </div>
                <div class=" col-lg-3">
                    <div class="input-group">
                        <span class="input-group-addon inpputgrtext table_inputs_SmallPadding2 inpputgrback">@Html.LabelFor(model => model.SearchEmployee)</span>
                        @Html.TextBoxFor(model => model.SearchEmployee, new { @class = "TxtComplete form-control table_inputs_SmallPadding2 inpputgr Emp" })
                        @Html.HiddenFor(model => model.SearchEmployeeID)
                    </div>
                </div>
                <div class="pull-right col-lg-3">
                    <div class="pull-right input-group">
                        <input type="button" id="GroupAddBtn" onclick="GroupAddBtnClick()" class="btn14 btn90 pull-right" value="Add Group">
                        <input type="button" id="GroupSearchBtn" onclick="GroupSearchBtnClick()" class="btn14 pull-right" value="Search" style="margin-right:17px;">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="HotelGridGroupCodeDiv" style="@(@Model.ViewGroupCode ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Group Code</span><div id="HotelGridGroupCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridCustomerCodeDiv" style="@(@Model.ViewCustomerCode ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Customer</span><div id="HotelGridCustomerCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridGroupNameDiv" style="@(@Model.ViewGroupName ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Group Name</span><div id="HotelGridGroupNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridGroupBookedUnderDiv" style="@(@Model.ViewGroupName ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Booked Under</span><div id="HotelGridGroupBookedUnderView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridPaxDiv" style="@(@Model.ViewPax ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Pax</span><div id="HotelGridPaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridGroupStatusDiv" style="@(@Model.ViewGroupStatus ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Group Status</span><div id="HotelGridGroupStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridVendorStatusDiv" style="@(@Model.ViewVendorStatus ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Vendor Status</span><div id="HotelGridVendorStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridArrivalDateDiv" style="@(@Model.ViewArrivalDate ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Arrival Date</span><div id="HotelGridArrivalDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridArrivalCityDiv" style="@(@Model.ViewArrivalCity ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Arrival City</span><div id="HotelGridArrivalCityView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridDepartureDateDiv" style="@(@Model.ViewDepartureDate ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Departure Date</span><div id="HotelGridDepartureDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    @*<div id="HotelGridDepartureCityDiv" style="@(@Model.ViewDepartureCity ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Departure City</span><div id="HotelGridDepartureCityView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>*@
    <div id="HotelGridFileCompDaysDiv" style="@(@Model.ViewFileCompDays ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>File Completion Days</span><div id="HotelGridFileCompDaysView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridRoomCountDiv" style="@(@Model.ViewRoomCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Room Count</span><div id="HotelGridRoomCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridEmployeeDiv" style="@(@Model.ViewEmployee ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Employee</span><div id="HotelGridEmployeeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridNightsDiv" style="@(@Model.ViewNights ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Nights</span><div id="HotelGridNightsView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridTotalCostDiv" style="@(@Model.ViewTotalCost ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Total Cost</span><div id="HotelGridTotalCostView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridBreakDownTotalDiv" style="@(@Model.ViewBreakDownTotal ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Break Down Total</span><div id="HotelGridBreakDownTotalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridOutstandingBalanceDiv" style="@(@Model.ViewOutstandingBalance ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Outstanding Balance</span><div id="HotelGridOutstandingBalanceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridComAmountDiv" style="@(@Model.ViewComAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Com Amount</span><div id="HotelGridComAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridComDifferenceDiv" style="@(@Model.ViewComDifference ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv"><span>Com Difference</span><div id="HotelGridComDifferenceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    </div>
    <div id="HotelGridVendorNameDiv" style="@(@Model.ViewVendorName ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Vendor Name</span><div id="HotelGridVendorNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridVConfHtmlDiv" style="@(@Model.ViewVConfHtml ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Details</span><div id="HotelGridVConfHtmlView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
      <div id="HotelGridVendorCityDiv" style="@(@Model.ViewVendorCity ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>City</span><div id="HotelGridVendorCityView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridVendorAddressDiv" style="@(@Model.ViewVendorAddress ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Address</span><div id="HotelGridVendorAddressView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
     <div id="HotelGridVendorPhoneDiv" style="@(@Model.ViewVendorPhone ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Phone</span><div id="HotelGridVendorPhoneView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridVendorContactNameDiv" style="@(@Model.ViewVendorContactName ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Name of Contact Person</span><div id="HotelGridVendorContactNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridVendorEmailDiv" style="@(@Model.ViewVendorEmail ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Email</span><div id="HotelGridVendorEmailView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCurrencyDiv" style="@(@Model.ViewCurrency ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Currency</span><div id="HotelGridCurrencyView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTotalInvoiceDiv" style="@(@Model.ViewTotalInvoice ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Total Invoice</span><div id="HotelGridTotalInvoiceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTotalPaidDiv" style="@(@Model.ViewTotalPaid ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Total Paid</span><div id="HotelGridTotalPaidView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridFirstPaymentDiv" style="@(@Model.ViewFirstPayment ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>1st Payment</span><div id="HotelGridFirstPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridFirstPaymentMethodDiv" style="@(@Model.ViewFirstPaymentMethod ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>1st Payment Method</span><div id="HotelGridFirstPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDateFirstPaymentDiv" style="@(@Model.ViewDateFirstPayment ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Date of 1st Payment</span><div id="HotelGridDateFirstPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridSecondPaymentDiv" style="@(@Model.ViewSecondPayment ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>2nd Payment</span><div id="HotelGridSecondPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridSecondPaymentMethodDiv" style="@(@Model.ViewSecondPaymentMethod ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>2nd Payment Method</span><div id="HotelGridSecondPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDateSecondPaymentDiv" style="@(@Model.ViewDateSecondPayment ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Date of 2nd Payment</span><div id="HotelGridDateSecondPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridThirdPaymentDiv" style="@(@Model.ViewThirdPayment ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>3rd Payment</span><div id="HotelGridThirdPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridThirdPaymentMethodDiv" style="@(@Model.ViewThirdPaymentMethod ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>3rd Payment Method</span><div id="HotelGridThirdPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDateThirdPaymentDiv" style="@(@Model.ViewDateThirdPayment ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Date of 3rd Payment</span><div id="HotelGridDateThirdPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTotalChargedDiv" style="@(@Model.ViewTotalCharged ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Total Charged</span><div id="HotelGridTotalChargedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridAuthDiffDiv" style="@(@Model.ViewAuthDiff ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Auth. Diff</span><div id="HotelGridAuthDiffView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridRefundReceivedHotelDiv" style="@(@Model.ViewRefundReceivedHotel ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Refund Received from Hotel</span><div id="HotelGridRefundReceivedHotelView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridAccountingMemoDiv" style="@(@Model.ViewAccountingMemo ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Accounting Memo</span><div id="HotelGridAccountingMemoView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCommissionStatusDiv" style="@(@Model.ViewCommissionStatus ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Commission Status</span><div id="HotelGridCommissionStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCommissionPrcDiv" style="@(@Model.ViewCommissionPrc ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Com %</span><div id="HotelGridCommissionPrcView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCommissionReceivedDiv" style="@(@Model.ViewCommissionReceived ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Com Received</span><div id="HotelGridCommissionReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCommissionDateReceivedDiv" style="@(@Model.ViewCommissionDateReceived ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Com Date Received</span><div id="HotelGridCommissionDateReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCheckNumberDiv" style="@(@Model.ViewCheckNumber ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Check Number</span><div id="HotelGridCheckNumberView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCheckAmountDiv" style="@(@Model.ViewCheckAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Check $</span><div id="HotelGridCheckAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridSGLCountDiv" style="@(@Model.ViewSGLCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>SGL</span><div id="HotelGridSGLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridSGLAmountDiv" style="@(@Model.ViewSGLAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>SGL $</span><div id="HotelGridSGLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDBLCountDiv" style="@(@Model.ViewDBLCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>DBL</span><div id="HotelGridDBLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDBLAmountDiv" style="@(@Model.ViewDBLAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>DBL $</span><div id="HotelGridDBLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTWNCountDiv" style="@(@Model.ViewTWNCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>TWN</span><div id="HotelGridTWNCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTWNAmountDiv" style="@(@Model.ViewTWNAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>TWN $</span><div id="HotelGridTWNAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTRPLCountDiv" style="@(@Model.ViewTRPLCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>TRPL</span><div id="HotelGridTRPLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTRPLAmountDiv" style="@(@Model.ViewTRPLAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>TRPL $</span><div id="HotelGridTRPLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQUDCountDiv" style="@(@Model.ViewQUDCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>QUD</span><div id="HotelGridQUDCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQUDAmountDiv" style="@(@Model.ViewQUDAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>QUD $</span><div id="HotelGridQUDAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridGuideCountDiv" style="@(@Model.ViewGuideCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Guide</span><div id="HotelGridGuideCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridGuideAmountDiv" style="@(@Model.ViewGuideAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Guide $</span><div id="HotelGridGuideAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDriverCountDiv" style="@(@Model.ViewDriverCount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Driver</span><div id="HotelGridDriverCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDriverAmountDiv" style="@(@Model.ViewDriverAmount ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Driver $</span><div id="HotelGridDriverAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridTaxPrcDiv" style="@(@Model.ViewTaxPrc ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Tax</span><div id="HotelGridTaxPrcView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridOccTaxDiv" style="@(@Model.ViewOccTax ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Occ Tax</span><div id="HotelGridOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
     <div id="HotelGridOccTaxDiv" style="@(@Model.ViewOccTax ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Occ Tax</span><div id="HotelGridOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridBagDiv" style="@(@Model.ViewBag ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Bag</span><div id="HotelGridBagView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridLunchDiv" style="@(@Model.ViewLunch ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Lunch</span><div id="HotelGridLunchView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDinnerDiv" style="@(@Model.ViewDinner ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Dinner</span><div id="HotelGridDinnerView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCompDiv" style="@(@Model.ViewComp ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Comp</span><div id="HotelGridCompView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridExtraCostDiv" style="@(@Model.ViewExtraCost ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Extra Cost</span><div id="HotelGridExtraCostView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridXLTDateDiv" style="@(@Model.ViewXLTDate ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>XLT Date</span><div id="HotelGridXLTDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDateFileReceivedDiv" style="@(@Model.ViewDateFileReceived ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Date File Received</span><div id="HotelGridDateFileReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDateFileCompletedDiv" style="@(@Model.ViewDateFileCompleted ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Date File Completed</span><div id="HotelGridDateFileCompletedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
     <div id="HotelGridDateFileCompletedDiv" style="@(@Model.ViewDateFileCompleted ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Date File Completed</span><div id="HotelGridDateFileCompletedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridDayOfArrivalDiv" style="@(@Model.ViewDayOfArrival ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Day of Arrival</span><div id="HotelGridDayOfArrivalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridMonthOfArrivalDiv" style="@(@Model.ViewMonthOfArrival ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Month of Arrival</span><div id="HotelGridMonthOfArrivalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridClientBookingCodeDiv" style="@(@Model.ViewClientBookingCode ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Client Booking Code</span><div id="HotelGridClientBookingCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCheckInDateDiv" style="@(@Model.ViewCheckInDate ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Check In</span><div id="HotelGridCheckInDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCheckOutDateDiv" style="@(@Model.ViewCheckOutDate ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Check Out</span><div id="HotelGridCheckOutDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridEstimatedNumberPaxDiv" style="@(@Model.ViewEstimatedNumberPax ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Est. Pax</span><div id="HotelGridEstimatedNumberPaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridEstimatedNumberRoomsDiv" style="@(@Model.ViewEstimatedNumberRooms ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Est. Rooms</span><div id="HotelGridEstimatedNumberRoomsView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaRoomDiffDiv" style="@(@Model.ViewQuotaRoomDiff ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Room Diff</span><div id="HotelGridQuotaRoomDiffView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaRoomDiv" style="@(@Model.ViewQuotaRoom ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Room</span><div id="HotelGridQuotaRoomView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaTaxDiv" style="@(@Model.ViewQuotaTax ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Tax</span><div id="HotelGridQuotaTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaOccTaxDiv" style="@(@Model.ViewQuotaOccTax ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted T/N</span><div id="HotelGridQuotaOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaBrkDiv" style="@(@Model.ViewQuotaBrk ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Brk</span><div id="HotelGridQuotaBrkView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaLgDiv" style="@(@Model.ViewQuotaLg ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Lg</span><div id="HotelGridQuotaLgView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaNightDiv" style="@(@Model.ViewQuotaNight ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Night</span><div id="HotelGridQuotaNightView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridConfirmedDiv" style="@(@Model.ViewConfirmed ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Conf</span><div id="HotelGridConfirmedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaVendorNameDiv" style="@(@Model.ViewQuotaVendorName ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Vendor Name</span><div id="HotelGridQuotaVendorNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridVendorTechDiv" style="@(@Model.ViewVendorTech ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Tech</span><div id="HotelGridVendorTechView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridVendorNoteDiv" style="@(@Model.ViewVendorNote ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Note</span><div id="HotelGridVendorNoteView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridQuotaNoteDiv" style="@(@Model.ViewQuotaNote ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>Quoted Note</span><div id="HotelGridQuotaNoteView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridABFDiv" style="@(@Model.ViewABF ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>ABF</span><div id="HotelGridABFView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    <div id="HotelGridCBFDiv" style="@(@Model.ViewCBF ? "display:none" : "")">
        <div class="HotelGridViewBtnDiv">
            <span>CBF</span><div id="HotelGridCBFView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
        </div>
    </div>
    if (!Model.ViewCurrency)
    {
        <div class="HotelGridViewBtnDiv"><span>Currency</span><div id="HotelGridCurrencyView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTotalInvoice)
    {
        <div class="HotelGridViewBtnDiv"><span>Total Invoice</span><div id="HotelGridTotalInvoiceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTotalPaid)
    {
        <div class="HotelGridViewBtnDiv"><span>Total Paid</span><div id="HotelGridTotalPaidView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewFirstPayment)
    {
        <div class="HotelGridViewBtnDiv"><span>1st Payment</span><div id="HotelGridFirstPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewFirstPaymentMethod)
    {
        <div class="HotelGridViewBtnDiv"><span>1st Payment Method</span><div id="HotelGridFirstPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDateFirstPayment)
    {
        <div class="HotelGridViewBtnDiv"><span>Date of 1st Payment</span><div id="HotelGridDateFirstPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewSecondPayment)
    {
        <div class="HotelGridViewBtnDiv"><span>2nd Payment</span><div id="HotelGridSecondPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewSecondPaymentMethod)
    {
        <div class="HotelGridViewBtnDiv"><span>2nd Payment Method</span><div id="HotelGridSecondPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDateSecondPayment)
    {
        <div class="HotelGridViewBtnDiv"><span>Date of 2nd Payment</span><div id="HotelGridDateSecondPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewThirdPayment)
    {
        <div class="HotelGridViewBtnDiv"><span>3rd Payment</span><div id="HotelGridThirdPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewThirdPaymentMethod)
    {
        <div class="HotelGridViewBtnDiv"><span>3rd Payment Method</span><div id="HotelGridThirdPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDateThirdPayment)
    {
        <div class="HotelGridViewBtnDiv"><span>Date of 3rd Payment</span><div id="HotelGridDateThirdPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewRefundReceivedHotel)
    {
        <div class="HotelGridViewBtnDiv"><span>Refund Received from Hotel</span><div id="HotelGridRefundReceivedHotelView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTotalCharged)
    {
        <div class="HotelGridViewBtnDiv"><span>Total Charged</span><div id="HotelGridTotalChargedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
       if (!Model.ViewAuthDiff)
    {
        <div class="HotelGridViewBtnDiv"><span>Auth. Diff</span><div id="HotelGridAuthDiffView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewAccountingMemo)
    {
        <div class="HotelGridViewBtnDiv"><span>Accounting Memo</span><div id="HotelGridAccountingMemoView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCommissionStatus)
    {
        <div class="HotelGridViewBtnDiv"><span>Commission Status</span><div id="HotelGridCommissionStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCommissionPrc)
    {
        <div class="HotelGridViewBtnDiv"><span>Com %</span><div id="HotelGridCommissionPrcView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCommissionReceived)
    {
        <div class="HotelGridViewBtnDiv"><span>Com Received</span><div id="HotelGridCommissionReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCommissionDateReceived)
    {
        <div class="HotelGridViewBtnDiv"><span>Com Date Received</span><div id="HotelGridCommissionDateReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCheckNumber)
    {
        <div class="HotelGridViewBtnDiv"><span>Check Number</span><div id="HotelGridCheckNumberView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCheckAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>Check $</span><div id="HotelGridCheckAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewSGLCount)
    {
        <div class="HotelGridViewBtnDiv"><span>SGL</span><div id="HotelGridSGLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewSGLAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>SGL $</span><div id="HotelGridSGLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDBLCount)
    {
        <div class="HotelGridViewBtnDiv"><span>DBL</span><div id="HotelGridDBLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDBLAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>DBL $</span><div id="HotelGridDBLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTWNCount)
    {
        <div class="HotelGridViewBtnDiv"><span>TWN</span><div id="HotelGridTWNCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTWNAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>TWN $</span><div id="HotelGridTWNAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTRPLCount)
    {
        <div class="HotelGridViewBtnDiv"><span>TRPL</span><div id="HotelGridTRPLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTRPLAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>TRPL $</span><div id="HotelGridTRPLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQUDCount)
    {
        <div class="HotelGridViewBtnDiv"><span>QUD</span><div id="HotelGridQUDCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQUDAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>QUD $</span><div id="HotelGridQUDAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewGuideCount)
    {
        <div class="HotelGridViewBtnDiv"><span>Guide</span><div id="HotelGridGuideCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewGuideAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>Guide $</span><div id="HotelGridGuideAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDriverCount)
    {
        <div class="HotelGridViewBtnDiv"><span>Driver</span><div id="HotelGridDriverCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDriverAmount)
    {
        <div class="HotelGridViewBtnDiv"><span>Driver $</span><div id="HotelGridDriverAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewTaxPrc)
    {
        <div class="HotelGridViewBtnDiv"><span>Tax</span><div id="HotelGridTaxPrcView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewOccTax)
    {
        <div class="HotelGridViewBtnDiv"><span>Occ Tax</span><div id="HotelGridOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCBF)
    {
        <div class="HotelGridViewBtnDiv"><span>CBF</span><div id="HotelGridCBFView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewABF)
    {
        <div class="HotelGridViewBtnDiv"><span>ABF</span><div id="HotelGridABFView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewBag)
    {
        <div class="HotelGridViewBtnDiv"><span>Bag</span><div id="HotelGridBagView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
     if (!Model.ViewLunch)
    {
        <div class="HotelGridViewBtnDiv"><span>Lunch</span><div id="HotelGridLunchView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
     if (!Model.ViewDinner)
    {
        <div class="HotelGridViewBtnDiv"><span>Dinner</span><div id="HotelGridDinnerView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewComp)
    {
        <div class="HotelGridViewBtnDiv"><span>Comp</span><div id="HotelGridCompView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewExtraCost)
    {
        <div class="HotelGridViewBtnDiv"><span>Extra Cost</span><div id="HotelGridExtraCostView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewXLTDate)
    {
        <div class="HotelGridViewBtnDiv"><span>XLT Date</span><div id="HotelGridXLTDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDateFileReceived)
    {
        <div class="HotelGridViewBtnDiv"><span>Date File Received</span><div id="HotelGridDateFileReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDateFileCompleted)
    {
        <div class="HotelGridViewBtnDiv"><span>Date File Completed</span><div id="HotelGridDateFileCompletedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewDayOfArrival)
    {
        <div class="HotelGridViewBtnDiv"><span>Day of Arrival</span><div id="HotelGridDayOfArrivalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewMonthOfArrival)
    {
        <div class="HotelGridViewBtnDiv"><span>Month of Arrival</span><div id="HotelGridMonthOfArrivalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewClientBookingCode)
    {
        <div class="HotelGridViewBtnDiv"><span>Client Booking Code</span><div id="HotelGridClientBookingCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCheckInDate)
    {
        <div class="HotelGridViewBtnDiv"><span>Check In</span><div id="HotelGridCheckInDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewCheckOutDate)
    {
        <div class="HotelGridViewBtnDiv"><span>Check Out</span><div id="HotelGridCheckOutDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
      if (!Model.ViewEstimatedNumberPax)
    {
        <div class="HotelGridViewBtnDiv"><span>Est. Pax</span><div id="HotelGridEstimatedNumberPaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewEstimatedNumberRooms)
    {
        <div class="HotelGridViewBtnDiv"><span>Est. Rooms</span><div id="HotelGridEstimatedNumberRoomsView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaRoom)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Room</span><div id="HotelGridQuotaRoomView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaTax)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Tax</span><div id="HotelGridQuotaTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaOccTax)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted T/N</span><div id="HotelGridQuotaOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaBrk)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Brk</span><div id="HotelGridQuotaBrkView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaLg)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Lg</span><div id="HotelGridQuotaLgView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaNight)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Nights</span><div id="HotelGridQuotaNightView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaVendorName)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Vendor Name</span><div id="HotelGridQuotaVendorNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewQuotaNote)
    {
        <div class="HotelGridViewBtnDiv"><span>Quoted Note</span><div id="HotelGridQuotaNoteView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewConfirmed)
    {
        <div class="HotelGridViewBtnDiv"><span>Conf</span><div id="HotelGridConfirmedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorName)
    {
        <div class="HotelGridViewBtnDiv"><span>Vendor Name</span><div id="HotelGridVendorNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorAddress)
    {
        <div class="HotelGridViewBtnDiv"><span>Address</span><div id="HotelGridVendorAddressView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorPhone)
    {
        <div class="HotelGridViewBtnDiv"><span>Phone</span><div id="HotelGridVendorPhoneView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorEmail)
    {
        <div class="HotelGridViewBtnDiv"><span>Email</span><div id="HotelGridVendorEmailView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorContactName)
    {
        <div class="HotelGridViewBtnDiv"><span>Name of Contact Person</span><div id="HotelGridVendorContactNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorCity)
    {
        <div class="HotelGridViewBtnDiv"><span>City</span><div id="HotelGridVendorCityView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorTech)
    {
        <div class="HotelGridViewBtnDiv"><span>Tech</span><div id="HotelGridVendorTechView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    if (!Model.ViewVendorNote)
    {
        <div class="HotelGridViewBtnDiv"><span>Notes</span><div id="HotelGridVendorNoteView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div></div>
    }
    <div id="RemoveFiltersDiv" class="RemoveFiltersDiv" style="display:none">
        <span class="RemoveFiltersSpan">Filters :</span>
        @if (Model.HotelFilterSelCustomerCode != null)
        { 
            if (Model.HotelFilterSelCustomerCode.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Customer</span><div id="RemoveCustomerFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelGroupCode != null)
        { 
            if (Model.HotelFilterSelGroupCode.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Group Code</span><div id="RemoveGroupCodeFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelGroupName != null)
        { 
            if (Model.HotelFilterSelGroupName.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Group Name</span><div id="RemoveGroupNameFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelVendorName != null)
        {
            if (Model.HotelFilterSelVendorName.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Vendor Name</span><div id="RemoveVendorNameFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelVendorCity != null)
        {
            if (Model.HotelFilterSelVendorCity.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Vendor City</span><div id="RemoveVendorCityFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelStatus != null)
        {
            if (Model.HotelFilterSelStatus.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Status</span><div id="RemoveStatusFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelGroupStatus != null)
        {
            if (Model.HotelFilterSelGroupStatus.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Group Status</span><div id="RemoveGroupStatusFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelArrivalCity != null)
        {
            if (Model.HotelFilterSelArrivalCity.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Arrival City</span><div id="RemoveArrivalCityFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelEstNumberRoom != null)
        {
            if (Model.HotelFilterSelEstNumberRoom.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Est. Number Room</span><div id="RemoveEstNumberRoomFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelDayofArrival != null)
        {
            if (Model.HotelFilterSelDayofArrival.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Day of Arrival</span><div id="RemoveDayofArrivalFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
        @if (Model.HotelFilterSelMonthofArrival != null)
        {
            if (Model.HotelFilterSelMonthofArrival.Count > 0)
            {
                <div class="HotelGridViewBtnDiv"><span>Month of Arrival</span><div id="RemoveMonthofArrivalFilter" class="HotelGridViewBtn" onclick="RemoveHotelFilter(this)"></div></div>
                Model.IsRemoveFilterDivShow = true;
            }
        }
    </div>
         <div id="OperHotelGridFilters" style="width:1200px; float:left; padding-top:12px; padding-right:5px; padding-bottom:8px;">
             <div class="HotelGridFilterDiv" id="HotelGridCustomerCodeMainDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterCustomerCode,
                                                model => model.HotelFilterCustomerCode,
                                                customer => customer.Id,
                                                customer => customer.Name,
                                                model => model.HotelFilterSelCustomerCode,
                                                MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridGroupCodeMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterGroupCode,
                                      model => model.HotelFilterGroupCode,
                                      grp => grp.Id,
                                      grp => grp.Name,
                                      model => model.HotelFilterSelGroupCode,
                                      MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridGroupNameMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterGroupName,
                                      model => model.HotelFilterGroupName,
                                      grp => grp.Id,
                                      grp => grp.Name,
                                      model => model.HotelFilterSelGroupName,
                                      MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridVendorNameMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterVendorName,
                                        model => model.HotelFilterVendorName,
                                        vnd => vnd.Id,
                                        vnd => vnd.Name,
                                        model => model.HotelFilterSelVendorName,
                                        MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridVendorCityMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterVendorCity,
                                        model => model.HotelFilterVendorCity,
                                        vndcity => vndcity.Id,
                                        vndcity => vndcity.Name,
                                        model => model.HotelFilterSelVendorCity,
                                        MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridStatusMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterStatus,
                                      model => model.HotelFilterStatus,
                                      status => status.Id,
                                      status => status.Name,
                                      model => model.HotelFilterSelStatus,
                                      MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridGroupStatusMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterGroupStatus,
                                      model => model.HotelFilterGroupStatus,
                                      grpstatus => grpstatus.Id,
                                      grpstatus => grpstatus.Name,
                                      model => model.HotelFilterSelGroupStatus,
                                      MvcCheckBoxList.Model.Position.Vertical)
             </div>
             <div id="HotelGridArrivalCityMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterArrivalCity,
                                      model => model.HotelFilterArrivalCity,
                                      arrcity => arrcity.Id,
                                      arrcity => arrcity.Name,
                                      model => model.HotelFilterSelArrivalCity,
                                      MvcCheckBoxList.Model.Position.Vertical)

             </div>
             <div id="HotelGridEstNumberRoomMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterEstNumberRoom,
                                      model => model.HotelFilterEstNumberRoom,
                                      estnumberroom => estnumberroom.Id,
                                      estnumberroom => estnumberroom.Name,
                                      model => model.HotelFilterSelEstNumberRoom,
                                      MvcCheckBoxList.Model.Position.Vertical)

             </div>
             <div id="HotelGridDayofArrivalMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterDayofArrival,
                                      model => model.HotelFilterDayofArrival,
                                      dayofarrival => dayofarrival.Id,
                                      dayofarrival => dayofarrival.Name,
                                      model => model.HotelFilterSelDayofArrival,
                                      MvcCheckBoxList.Model.Position.Vertical)

             </div>
             <div id="HotelGridMonthofArrivalMainDiv" class="HotelGridFilterDiv">
                 <div class="HotelGridFilterDivClose"></div>
                 @Html.CheckBoxListFor(model => model.SelectedFilterMonthofArrival,
                                      model => model.HotelFilterMonthofArrival,
                                      monthofarrival => monthofarrival.Id,
                                      monthofarrival => monthofarrival.Name,
                                      model => model.HotelFilterSelMonthofArrival,
                                      MvcCheckBoxList.Model.Position.Vertical)

             </div>
         </div>
        
        <div style="display:none;">
            <div id="GroupCodeDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Group Code</span>
                    @Html.HiddenFor(model => model.ViewGroupCode)
                    <div id="HotelGridGroupCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelGroupCodeFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridGroupCode"></div>
                    }
                </div>
            </div>
            <div id="CustomerCodeDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Customer</span>
                    @Html.HiddenFor(model => model.ViewCustomerCode)
                    <div id="HotelGridCustomerCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelCustomerFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridCustomerCode"></div>
                    }
                </div>
            </div>
            <div id="GroupNameDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Group Name</span>
                    @Html.HiddenFor(model => model.ViewGroupName)
                    <div id="HotelGridGroupNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelGroupNameFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridGroupName"></div>
                    }
                </div>
            </div>
            <div id="GroupBookedUnderDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Booked Under</span>
                    @Html.HiddenFor(model => model.ViewGroupName)
                    <div id="HotelGridGroupNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    
                </div>
            </div>
            <div id="PaxDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Pax</span>
                    @Html.HiddenFor(model => model.ViewPax)
                    <div id="HotelGridPaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="GroupStatusDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Group Status</span>
                    @Html.HiddenFor(model => model.ViewGroupStatus)
                    <div id="HotelGridGroupStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelGroupStatusFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridGroupStatus"></div>
                    }
                </div>
            </div>
            <div id="VendorStatusDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Vendor Status</span>
                    @Html.HiddenFor(model => model.ViewVendorStatus)
                    <div id="HotelGridVendorStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelVendorStatusFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridStatus"></div>
                    }
                </div>
            </div>
            <div id="ArrivalDateDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Arrival Date</span>
                    @Html.HiddenFor(model => model.ViewArrivalDate)
                    <div id="HotelGridArrivalDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ArrivalCityDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Arrival City</span>
                    @Html.HiddenFor(model => model.ViewArrivalCity)
                    <div id="HotelGridArrivalCityView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelArrivalCityFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridArrivalCity"></div>
                    }
                </div>
            </div>
            <div id="DepartureDateDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Departure Date</span>
                    @Html.HiddenFor(model => model.ViewDepartureDate)
                    <div id="HotelGridDepartureDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            @*<div id="DepartureCityDiv">
                <span>Departure City</span>
                @Html.HiddenFor(model => model.ViewDepartureCity)
                <div id="HotelGridDepartureCityView" class="HotelGridViewBtn"></div>
            </div>*@
            <div id="FileCompDaysDiv">
                <div class="OperationHotelCompletion">
                    <span>File Completion Days</span>
                    @Html.HiddenFor(model => model.ViewFileCompDays)
                    <div id="HotelGridFileCompDaysView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="RoomCountDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Room Count</span>
                    @Html.HiddenFor(model => model.ViewRoomCount)
                    <div id="HotelGridRoomCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="EmployeeDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Employee</span>
                    @Html.HiddenFor(model => model.ViewEmployee)
                    <div id="HotelGridEmployeeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="NightsDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Nights</span>
                    @Html.HiddenFor(model => model.ViewNights)
                    <div id="HotelGridNightsView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TotalCostDiv">
                <div class="OperationHotelTotals">
                    <span>Total Cost</span>
                    @Html.HiddenFor(model => model.ViewTotalCost)
                    <div id="HotelGridTotalCostView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="BreakDownTotalDiv">
                <div class="OperationHotelTotals">
                    <span>Break Down Total</span>
                    @Html.HiddenFor(model => model.ViewBreakDownTotal)
                    <div id="HotelGridBreakDownTotalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="OutstandingBalanceDiv">
                <div class="OperationHotelTotals">
                    <span>Outstanding Balance</span>
                    @Html.HiddenFor(model => model.ViewOutstandingBalance)
                    <div id="HotelGridOutstandingBalanceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ComAmountDiv">
                <div class="OperationHotelComissions">
                    <span>Com Amount</span>
                    @Html.HiddenFor(model => model.ViewComAmount)
                    <div id="HotelGridComAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ComDifferenceDiv">
                <div class="OperationHotelComissions">
                    <span>Com Difference</span>
                    @Html.HiddenFor(model => model.ViewComDifference)
                    <div id="HotelGridComDifferenceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CurrencyDiv">
                <div class="OperationHotelTotals">
                    <span>Currency</span>
                    @Html.HiddenFor(model => model.ViewCurrency)
                    <div id="HotelGridCurrencyView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TotalInvoiceDiv">
                <div class="OperationHotelTotals">
                    <span>Total Invoice</span>
                    @Html.HiddenFor(model => model.ViewTotalInvoice)
                    <div id="HotelGridTotalInvoiceView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TotalPaidDiv">
                <div class="OperationHotelTotals">
                    <span>Total Paid</span>
                    @Html.HiddenFor(model => model.ViewTotalPaid)
                    <div id="HotelGridTotalPaidView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="FirstPaymentDiv">
                <div class="OperationHotelPayments">
                    <span>1st Payment</span>
                    @Html.HiddenFor(model => model.ViewFirstPayment)
                    <div id="HotelGridFirstPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="FirstPaymentMethodDiv">
                <div class="OperationHotelPayments">
                    <span>1st Payment Method</span>
                    @Html.HiddenFor(model => model.ViewFirstPaymentMethod)
                    <div id="HotelGridFirstPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DateFirstPaymentDiv">
                <div class="OperationHotelPayments">
                    <span>Date of 1st Payment</span>
                    @Html.HiddenFor(model => model.ViewDateFirstPayment)
                    <div id="HotelGridDateFirstPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="SecondPaymentDiv">
                <div class="OperationHotelPayments">
                    <span>2nd Payment</span>
                    @Html.HiddenFor(model => model.ViewSecondPayment)
                    <div id="HotelGridSecondPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="SecondPaymentMethodDiv">
                <div class="OperationHotelPayments">
                    <span>2nd Payment Method</span>
                    @Html.HiddenFor(model => model.ViewSecondPaymentMethod)
                    <div id="HotelGridSecondPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DateSecondPaymentDiv">
                <div class="OperationHotelPayments">
                    <span>Date of 2nd Payment</span>
                    @Html.HiddenFor(model => model.ViewDateSecondPayment)
                    <div id="HotelGridDateSecondPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ThirdPaymentDiv">
                <div class="OperationHotelPayments">
                    <span>3rd Payment</span>
                    @Html.HiddenFor(model => model.ViewThirdPayment)
                    <div id="HotelGridThirdPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ThirdPaymentMethodDiv">
                <div class="OperationHotelPayments">
                    <span>3rd Payment Method</span>
                    @Html.HiddenFor(model => model.ViewThirdPaymentMethod)
                    <div id="HotelGridThirdPaymentMethodView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DateThirdPaymentDiv">
                <div class="OperationHotelPayments">
                    <span>Date of 3rd Payment</span>
                    @Html.HiddenFor(model => model.ViewDateThirdPayment)
                    <div id="HotelGridDateThirdPaymentView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="RefundReceivedHotelDiv">
                <div class="OperationHotelTotals">
                    <span>Refund Received from Hotel</span>
                    @Html.HiddenFor(model => model.ViewRefundReceivedHotel)
                    <div id="HotelGridRefundReceivedHotelView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TotalChargedDiv">
                <div class="OperationHotelTotals">
                    <span>Total Charged</span>
                    @Html.HiddenFor(model => model.ViewTotalCharged)
                    <div id="HotelGridTotalChargedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="AuthDiffDiv">
                <div class="OperationHotelTotals">
                    <span>Auth. Diff</span>
                    @Html.HiddenFor(model => model.ViewAuthDiff)
                    <div id="HotelGridAuthDiffView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="AccountingMemoDiv">
                <div class="OperationHotelTotals">
                    <span>Accounting Memo</span>
                    @Html.HiddenFor(model => model.ViewAccountingMemo)
                    <div id="HotelGridAccountingMemoView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CommissionStatusDiv">
                <div class="OperationHotelComissions">
                    <span>Commission Status</span>
                    @Html.HiddenFor(model => model.ViewCommissionStatus)
                    <div id="HotelGridCommissionStatusView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CommissionPrcDiv">
                <div class="OperationHotelComissions">
                    <span>Com %</span>
                    @Html.HiddenFor(model => model.ViewCommissionPrc)
                    <div id="HotelGridCommissionPrcView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CommissionReceivedDiv">
                <div class="OperationHotelComissions">
                    <span>Com Received</span>
                    @Html.HiddenFor(model => model.ViewCommissionReceived)
                    <div id="HotelGridCommissionReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CommissionDateReceivedDiv">
                <div class="OperationHotelComissions">
                    <span>Com Date Received</span>
                    @Html.HiddenFor(model => model.ViewCommissionDateReceived)
                    <div id="HotelGridCommissionDateReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CheckNumberDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Check Number</span>
                    @Html.HiddenFor(model => model.ViewCheckNumber)
                    <div id="HotelGridCheckNumberView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CheckAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Check $</span>
                    @Html.HiddenFor(model => model.ViewCheckAmount)
                    <div id="HotelGridCheckAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="SGLCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>SGL</span>
                    @Html.HiddenFor(model => model.ViewSGLCount)
                    <div id="HotelGridSGLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="SGLAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>SGL $</span>
                    @Html.HiddenFor(model => model.ViewSGLAmount)
                    <div id="HotelGridSGLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DBLCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>DBL</span>
                    @Html.HiddenFor(model => model.ViewDBLCount)
                    <div id="HotelGridDBLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DBLAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>DBL $</span>
                    @Html.HiddenFor(model => model.ViewDBLAmount)
                    <div id="HotelGridDBLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TWNCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>TWN</span>
                    @Html.HiddenFor(model => model.ViewTWNCount)
                    <div id="HotelGridTWNCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TWNAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>TWN $</span>
                    @Html.HiddenFor(model => model.ViewTWNAmount)
                    <div id="HotelGridTWNAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TRPLCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>TRPL</span>
                    @Html.HiddenFor(model => model.ViewTRPLCount)
                    <div id="HotelGridTRPLCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TRPLAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>TRPL $</span>
                    @Html.HiddenFor(model => model.ViewTRPLAmount)
                    <div id="HotelGridTRPLAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QUDCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>QUD</span>
                    @Html.HiddenFor(model => model.ViewQUDCount)
                    <div id="HotelGridQUDCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QUDAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>QUD $</span>
                    @Html.HiddenFor(model => model.ViewQUDAmount)
                    <div id="HotelGridQUDAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="GuideCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Guide</span>
                    @Html.HiddenFor(model => model.ViewGuideCount)
                    <div id="HotelGridGuideCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="GuideAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Guide $</span>
                    @Html.HiddenFor(model => model.ViewGuideAmount)
                    <div id="HotelGridGuideAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DriverCountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Driver</span>
                    @Html.HiddenFor(model => model.ViewDriverCount)
                    <div id="HotelGridDriverCountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DriverAmountDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Driver $</span>
                    @Html.HiddenFor(model => model.ViewDriverAmount)
                    <div id="HotelGridDriverAmountView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="TaxPrcDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Tax</span>
                    @Html.HiddenFor(model => model.ViewTaxPrc)
                    <div id="HotelGridTaxPrcView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="OccTaxDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Occ Tax</span>
                    @Html.HiddenFor(model => model.ViewOccTax)
                    <div id="HotelGridOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CBFDiv">
                <div class="OperationHotelRoomTypes">
                    <span>CBF</span>
                    @Html.HiddenFor(model => model.ViewCBF)
                    <div id="HotelGridCBFView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="SelDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Sel.</span>
                </div>
            </div>
            <div id="ABFDiv">
                <div class="OperationHotelRoomTypes">
                    <span>ABF</span>
                    @Html.HiddenFor(model => model.ViewABF)
                    <div id="HotelGridABFView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VConfHtmlDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Details</span>
                    @Html.HiddenFor(model => model.ViewVConfHtml)
                    <div id="HotelGridVConfHtmlView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="PayMeth1FormHtmlDiv">
                <div class="OperationHotelPayments">
                    <span>Pay 1 Details</span>
                </div>
            </div>
            <div id="PayMeth2FormHtmlDiv">
                <div class="OperationHotelPayments">
                    <span>Pay 2 Details</span>
                </div>
            </div>
            <div id="PayMeth3FormHtmlDiv">
                <div class="OperationHotelPayments">
                    <span>Pay 3 Details</span>
                </div>
            </div>
            <div id="VendorContractHtmlDiv">
                <div class="OperationHotelVendorInfo">
                    <span>View General Contract</span>
                </div>
            </div>
            <div id="VendorGroupContractHtmlDiv">
                <div class="OperationHotelVendorInfo">
                    <span>View Vendor Contract</span>
                </div>
            </div>
            <div id="BagDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Bag</span>
                    @Html.HiddenFor(model => model.ViewBag)
                    <div id="HotelGridBagView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="LunchDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Lunch</span>
                    @Html.HiddenFor(model => model.ViewLunch)
                    <div id="HotelGridLunchView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DinnerDiv">
                <div class="OperationHotelRoomTypes">
                    <span>Dinner</span>
                    @Html.HiddenFor(model => model.ViewDinner)
                    <div id="HotelGridDinnerView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CompDiv">
                <div class="OperationHotelTotals">
                    <span>Comp</span>
                    @Html.HiddenFor(model => model.ViewComp)
                    <div id="HotelGridCompView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ExtraCostDiv">
                <div class="OperationHotelTotals">
                    <span>Extra Cost</span>
                    @Html.HiddenFor(model => model.ViewExtraCost)
                    <div id="HotelGridExtraCostView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="XLTDateDiv">
                <div class="OperationHandsontable">
                    <span>XLT Date</span>
                    @Html.HiddenFor(model => model.ViewXLTDate)
                    <div id="HotelGridXLTDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DateFileReceivedDiv">
                <div class="OperationHotelCompletion">
                    <span>Date File Received</span>
                    @Html.HiddenFor(model => model.ViewDateFileReceived)
                    <div id="HotelGridDateFileReceivedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DateFileCompletedDiv">
                <div class="OperationHotelCompletion">
                    <span>Date File Completed</span>
                    @Html.HiddenFor(model => model.ViewDateFileCompleted)
                    <div id="HotelGridDateFileCompletedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="DayOfArrivalDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Day of Arrival</span>
                    @Html.HiddenFor(model => model.ViewDayOfArrival)
                    <div id="HotelGridDayOfArrivalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelDayofArrivalFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridDayofArrival"></div>
                    }
                </div>
            </div>
            <div id="MonthOfArrivalDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Month of Arrival</span>
                    @Html.HiddenFor(model => model.ViewMonthOfArrival)
                    <div id="HotelGridMonthOfArrivalView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelMonthofArrivalFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridMonthofArrival"></div>
                    }
                </div>
            </div>
            <div id="ClientBookingCodeDiv">
                <div class="OperationHandsontable">
                    <span>Client Booking Code</span>
                    @Html.HiddenFor(model => model.ViewClientBookingCode)
                    <div id="HotelGridClientBookingCodeView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CheckInDateDiv">
                <div class="OperationHandsontable">
                    <span>Check In</span>
                    @Html.HiddenFor(model => model.ViewCheckInDate)
                    <div id="HotelGridCheckInDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="CheckOutDateDiv">
                <div class="OperationHandsontable">
                    <span>Check Out</span>
                    @Html.HiddenFor(model => model.ViewCheckOutDate)
                    <div id="HotelGridCheckOutDateView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="EstimatedNumberPaxDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Est. Pax</span>
                    @Html.HiddenFor(model => model.ViewEstimatedNumberPax)
                    <div id="HotelGridEstimatedNumberPaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="EstimatedNumberRoomsDiv">
                <div class="OperationHotelGroupInfo">
                    <span>Est. Rooms</span>
                    @Html.HiddenFor(model => model.ViewEstimatedNumberRooms)
                    <div id="HotelGridEstimatedNumberRoomsView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelEstimatedNumberofRoomsFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridEstNumberRoom"></div>
                    }
                </div>
            </div>
            <div id="QuotaRoomDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Room</span>
                    @Html.HiddenFor(model => model.ViewQuotaRoom)
                    <div id="HotelGridQuotaRoomView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaRoomDiffDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Room Diff</span>
                    @Html.HiddenFor(model => model.ViewQuotaRoomDiff)
                    <div id="HotelGridQuotaRoomDiffView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaTaxDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Tax</span>
                    @Html.HiddenFor(model => model.ViewQuotaTax)
                    <div id="HotelGridQuotaTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaOccTaxDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted T/N</span>
                    @Html.HiddenFor(model => model.ViewQuotaOccTax)
                    <div id="HotelGridQuotaOccTaxView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaBrkDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Brk</span>
                    @Html.HiddenFor(model => model.ViewQuotaBrk)
                    <div id="HotelGridQuotaBrkView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaLgDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Lg</span>
                    @Html.HiddenFor(model => model.ViewQuotaLg)
                    <div id="HotelGridQuotaLgView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaNightDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Night</span>
                    @Html.HiddenFor(model => model.ViewQuotaNight)
                    <div id="HotelGridQuotaNightView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaVendorNameDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Vendor Name</span>
                    @Html.HiddenFor(model => model.ViewQuotaVendorName)
                    <div id="HotelGridQuotaVendorNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="QuotaNoteDiv">
                <div class="OperationHotelQuotaInfo">
                    <span>Quoted Note</span>
                    @Html.HiddenFor(model => model.ViewQuotaNote)
                    <div id="HotelGridQuotaNoteView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="ConfirmedDiv">
                <div class="OperationHandsontable">
                    <span>Conf</span>
                    @Html.HiddenFor(model => model.ViewConfirmed)
                    <div id="HotelGridConfirmedView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VendorNameDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Vendor Name</span>
                    @Html.HiddenFor(model => model.ViewVendorName)
                    <div id="HotelGridVendorNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelVendorNameFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridVendorName"></div>
                    }
                </div>
            </div>
            <div id="VendorAddressDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Address</span>
                    @Html.HiddenFor(model => model.ViewVendorAddress)
                    <div id="HotelGridVendorAddressView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VendorPhoneDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Phone</span>
                    @Html.HiddenFor(model => model.ViewVendorPhone)
                    <div id="HotelGridVendorPhoneView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VendorEmailDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Email</span>
                    @Html.HiddenFor(model => model.ViewVendorEmail)
                    <div id="HotelGridVendorEmailView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VendorContactNameDiv">
                <div class="OperationHotelVendorInfo">
                    <span>Name of Contact Person</span>
                    @Html.HiddenFor(model => model.ViewVendorContactName)
                    <div id="HotelGridVendorContactNameView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VendorCityDiv">
                <div class="OperationHotelVendorInfo">
                    <span>City</span>
                    @Html.HiddenFor(model => model.ViewVendorCity)
                    <div id="HotelGridVendorCityView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                    @if (@Model.OperationHotelCityFilter)
                    {
                        <div class="HotelGridFilterBtn" id="HotelGridVendorCity"></div>
                    }
                </div>
            </div>
            <div id="VendorTechDiv">
                <div class="OperationHandsontable">
                    <span>Tech</span>
                    @Html.HiddenFor(model => model.ViewVendorTech)
                    <div id="HotelGridVendorTechView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
            <div id="VendorNoteDiv">
                <div class="OperationHandsontable">
                    <span>Notes</span>
                    @Html.HiddenFor(model => model.ViewVendorNote)
                    <div id="HotelGridVendorNoteView" class="HotelGridViewBtn" onclick="HotelGridColumnHideUnhide(this)"></div>
                </div>
            </div>
        </div>

        <div id="OperHotelGrid" class="handsontable" style="width:1185px; height:400px; overflow:auto;"></div>
        @Html.HiddenFor(model => model.HotelPageNumber)
        @Html.HiddenFor(model => model.IsFilter)
        @Html.HiddenFor(model => model.IsSearch)
        @Html.HiddenFor(model => model.IsView)
        @Html.HiddenFor(model => model.IsCanNext)
        @Html.HiddenFor(model => model.IsCanPrev)
        @Html.HiddenFor(model => model.LeftScrollPossition)
        @Html.HiddenFor(model => model.TopScrollPossition)
    
        @Html.HiddenFor(model => model.IsRemoveFilterDivShow)
        @Html.HiddenFor(model => model.IsRemoveCustomerCodeFilter)
        @Html.HiddenFor(model => model.IsRemoveGroupCodeFilter)
        @Html.HiddenFor(model => model.IsRemoveGroupNameFilter)
        @Html.HiddenFor(model => model.IsRemoveVendorNameFilter)
        @Html.HiddenFor(model => model.IsRemoveVendorCityFilter)
        @Html.HiddenFor(model => model.IsRemoveStatusFilter)
        @Html.HiddenFor(model => model.IsRemoveGroupStatusFilter)
        @Html.HiddenFor(model => model.IsRemoveArrivalCityFilter)
        @Html.HiddenFor(model => model.IsRemoveEstNumberRoomFilter)
        @Html.HiddenFor(model => model.IsRemoveDayofArrivalFilter)
        @Html.HiddenFor(model => model.IsRemoveMonthofArrivalFilter)
    
        @Html.HiddenFor(model => model.TotInv)
        @Html.HiddenFor(model => model.TotInvCad)
        @Html.HiddenFor(model => model.TotCost)
        @Html.HiddenFor(model => model.TotCostCad)
    <div style="width:100%;height:25px;text-align:center;margin-top:15px;float:right">
        @if (Model.IsCanPrev)
        {
            <input type="button" id="HotelPrevBtn" onclick="HotelPrevBtnClick()" class="btn14" value="Prev" style="margin-left:10px;">
        }
        else
        {
            <input type="button" id="HotelPrevBtn" onclick="HotelPrevBtnClick()" class="btn14" value="Prev" disabled="disabled" style="margin-left:10px;">
        }
        <span style="padding-left:15px;padding-right:15px">@Html.LabelForModel(Model.Count)</span>
        @if (Model.IsCanNext)
        {
            <input type="button" id="HotelNextBtn" onclick="HotelNextBtnClick()" class="btn14" value="Next" style="margin-left:10px;">
        }
        else
        {
            <input type="button" id="HotelNextBtn" onclick="HotelNextBtnClick()" class="btn14" value="Next" disabled="disabled" style="margin-left:10px;">
        }
    </div>
    if (Model.OperationPLHotelView)
    {
        <div class="OperationTabsTitleDiv">
            <span class="OperationTabsTitle">Hotel P/L</span>
        </div>
        if (Model.OperationPLHotelTotalCostView || Model.OperationPLHotelTotalPaidView)
        {
           <div class="row form-row" style="@(@Model.Rows != null && @Model.Rows.Count > 0 ? "" : "display:none");width:840px !important;float:left !important;margin-left:10px !important;">
               @if (Model.OperationPLHotelTotalCostView)
               {
                   <div class=" col-lg-2 withoutPadding" style="width: 49% !important;">
                       <div class="input-group">
                           <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.OutstandingBalanceSum)</span>
                               @Html.Raw(Model.OutstandingBalanceSum)
                       </div>
                   </div>
               }
               @if (Model.OperationPLHotelTotalPaidView)
               { 
                   <div class=" col-lg-2 withoutPadding" style="width:49% !important;margin-left:10px;">
                       <div class="input-group">
                           <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.TotalPaidSum)</span>
                           @Html.Raw(Model.TotalPaidSum)
                       </div>
                   </div>
               }
               
           </div>
        }
        if (Model.OperationPLHotelTotalOutPayView || Model.OperationPLHotelOutComAmtView)
        {
            <div class="row form-row" style="@(@Model.Rows != null && @Model.Rows.Count > 0 ? "" : "display:none");width:840px !important;float:left !important;margin-left:10px !important;">
            @if(Model.OperationPLHotelTotalOutPayView)
                {
                    <div class=" col-lg-2 withoutPadding" style="width:49% !important;">
                        <div class="input-group">
                            <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.OutsatndingPaymentSum)</span>
                            @Html.Raw(Model.OutsatndingPaymentSum)
                        </div>
                    </div>
                }
                @if (Model.OperationPLHotelOutComAmtView)
                {
                <div class=" col-lg-2 withoutPadding" style="width:49% !important;margin-left:10px;">
                    <div class="input-group">
                        <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.OutsatndingComAmtSum)</span>
                        @Html.Raw(Model.OutsatndingComAmtSum)
                    </div>
                </div>
                }
              </div>
        }
         if (Model.OperationPLHotelTotalComAmtView || Model.OperationPLHotelTotalComRecView || Model.OperationPLHotelTotalRoomDiffView)
         {
            <div class="row form-row" style="@(@Model.Rows != null && @Model.Rows.Count > 0 ? "" : "display:none");width:840px !important;float:left !important;margin-left:10px !important;">
                @if (Model.OperationPLHotelTotalComAmtView)
                { 
                    <div class=" col-lg-2 withoutPadding" style="width:33% !important;">
                        <div class="input-group">
                            <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.ComAmtSum)</span>
                            @Html.Raw(Model.ComAmtSum)
                        </div>
                    </div>
                }
                @if (Model.OperationPLHotelTotalComRecView)
                { 
                    <div class=" col-lg-4 withoutPadding" style="width:32% !important; margin-left:10px;">
                        <div class="input-group">
                            <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.ComReceivedAmtSum)</span>
                            @Html.Raw(Model.ComReceivedAmtSum)
                        </div>
                    </div>
                }
                @if (Model.OperationPLHotelTotalRoomDiffView)
                { 
                    <div class=" col-lg-4 withoutPadding" style="width:32% !important;margin-left:10px;">
                        <div class="input-group">
                            <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.QuotaRoomDiffSum)</span>
                            @Html.Raw(Model.QuotaRoomDiffSum)
                        </div>
                    </div>
                }
            </div>
        }
        if (Model.OperationPLHotelGrpProfitView )
        {
            <div class="row form-row" style="@(@Model.Rows != null && @Model.Rows.Count > 0 ? "" : "display:none");width:840px !important;float:left !important;margin-left:10px !important;">
                   <div class=" col-lg-2 withoutPadding" style="width:33% !important;">
                       <div class="input-group">
                           <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.GroupProfit)</span>
                           @Html.Raw(Model.GroupProfit)
                       </div>
                   </div>

                   <div class=" col-lg-2 withoutPadding" style="width: 32% !important; margin-left: 10px;">
                       <div class="input-group">
                           <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.ProfitPers)</span>
                           @Html.Raw(Model.ProfitPers)
                       </div>
                   </div>
                   
                   <div class=" col-lg-2 withoutPadding" style="width: 32% !important; margin-left: 10px;">
                       <div class="input-group">
                           <span class="input-group-addon SumControlsLabelFSize">@Html.LabelFor(model => model.TotInvoice)</span>
                           @Html.Raw(Model.TotInvoice)
                       </div>
                   </div>
            </div>
        }
    }
    @*<input type="button" id="HotelMoreBtn" onclick="HotelMoreBtnClick()" class="btn14 pull-right" value="More" style="@(@Model.IsCanView?"":"display:none");margin-left:10px;">*@
    <div style="width:330px;height:25px;text-align:center;margin-top:15px;float:right">
        <div style="margin:0">
            <button class="btn14 pull-right" id="OperHotelSaveBtn" style="margin-left:10px;" onclick="HotelGridSave()" type="button">Save</button>
            <input type="button" id="GetSelected" class="btn14 btn120 pull-right" value="Copy For Email" disabled="disabled">
        </div>
    </div>
        <button id="HotelGridUpdate" style="display:none;" type="submit"></button>
}
